@rogieking/figui3 8.10.0 → 8.10.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/fig-lab.css +1 -1
- package/fig-lab.css +1 -4
- package/package.json +1 -1
package/dist/fig-lab.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
fig-ai-prompt{--fig-ai-prompt-margin-inline:var(--spacer-3);box-sizing:border-box;width:calc(100% - var(--fig-ai-prompt-margin-inline) - var(--fig-ai-prompt-margin-inline));min-height:8rem;margin-inline:var(--fig-ai-prompt-margin-inline);border:1px solid var(--figma-color-border);border-radius:var(--radius-large);background:var(--figma-color-bg);color:var(--figma-color-text);flex-direction:column;display:flex;&:has(>fig-input-text:focus-within){outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&>fig-input-text{width:100%;min-width:0;box-shadow:none;font-size:var(--body-large-fontSize);background:0 0;border-radius:0;flex:auto;&:hover,&:has(textarea:focus){box-shadow:none;outline:0}&[disabled]:not([disabled=false]){box-shadow:none;background:0 0}&>textarea{box-sizing:border-box;width:100%;height:auto;min-height:var(--spacer-6);padding:var(--spacer-3);resize:none;font-size:inherit;align-self:stretch;padding-bottom:0}}&>fig-attachments{box-sizing:border-box;width:auto;margin:var(--spacer-2) var(--spacer-3) 0}&>fig-footer{box-shadow:none;border:none;justify-content:space-between}}fig-ai-context{--fig-ai-context-margin-inline:var(--spacer-3);gap:var(--spacer-2);box-sizing:border-box;width:calc(100% - var(--fig-ai-context-margin-inline) - var(--fig-ai-context-margin-inline));margin-inline:var(--fig-ai-context-margin-inline);padding:var(--spacer-2) var(--spacer-2-5);padding-bottom:var(--spacer-4);border:1px solid var(--figma-color-border);border-radius:var(--radius-large) var(--radius-large) 0 0;color:var(--figma-color-text);border-bottom:none;flex-direction:column;display:flex;&>fig-attachments{margin-inline:calc(-1 * var(--spacer-1))}}fig-ai-context:has(+fig-ai-prompt){margin-bottom:calc(-1 * var(--spacer-3))}fig-attachments{align-items:flex-start;gap:var(--spacer-2);flex-wrap:wrap;width:100%;min-width:0;display:flex}fig-attachment{--fig-attachment-size:2.5rem;flex:0 0 var(--fig-attachment-size);width:var(--fig-attachment-size);height:var(--fig-attachment-size);min-width:0;display:block;position:relative;& fig-image{width:100%;display:flex}& .fig-attachment-fallback{border-radius:var(--radius-medium);background:var(--figma-color-bg-secondary);box-shadow:inset 0 0 0 1px var(--figma-color-bordertranslucent);color:var(--figma-color-text-secondary);font-size:var(--body-medium-fontSize);pointer-events:none;place-items:center;font-weight:500;line-height:1;display:none;position:absolute;inset:0}&[data-fallback]{& .fig-attachment-fallback{display:grid}}& .fig-attachment-remove{--spacer-2:0px;--spacer-4:1.25rem;z-index:3;top:var(--spacer-1);right:var(--spacer-1);opacity:0;pointer-events:none;width:1.25rem;min-width:1.25rem;height:1.25rem;padding:0;position:absolute}&:hover .fig-attachment-remove,&:focus-within .fig-attachment-remove{opacity:1;pointer-events:auto}&[disabled]:not([disabled=false]){opacity:.5;& .fig-attachment-remove{pointer-events:none}}}fig-chat-message{gap:var(--spacer-2-5);box-sizing:border-box;width:100%;max-width:100%;color:var(--figma-color-text);font-size:var(--body-large-fontSize);overflow-wrap:anywhere;white-space:pre-wrap;flex-direction:column;display:flex;&[from=user]{width:auto;padding:var(--spacer-2-5);border-radius:var(--radius-large);background:var(--figma-color-bg-secondary);margin-inline-start:var(--spacer-4)}&[from=user]:has(>fig-avatar){margin-inline-end:calc(var(--spacer-4) + var(--spacer-2));position:relative;&>fig-avatar{right:calc(-1 * (var(--spacer-4) + var(--spacer-2)));position:absolute;bottom:0}}&+fig-chat-message{margin-top:var(--spacer-3)}}:is(propskit-switch,propskit-color,propskit-fill,propskit-gradient,propskit-palette,propskit-select,propskit-easing,propskit-text,propskit-number,propskit-origin,propskit-position,propskit-joystick,propskit-spring,propskit-color-point,propskit-point-radius,propskit-point-radius-angle,propskit-point-point,propskit-group,propskit-slider,propskit-wheel,propskit-oscillator){--figma-focus-outline-radius:var(--radius-medium-large);user-select:none;& :is(input:not([type]),input[type=text],input[type=number],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url],textarea,[contenteditable=true]){user-select:text}}propskit-group{width:100%;margin-bottom:var(--spacer-2-5);display:block;& p{margin:0 var(--spacer-3) var(--spacer-2) var(--spacer-3)}&+propskit-group{box-shadow:inset 0 1px 0 0 var(--figma-color-border);&:not([name]){padding-top:var(--spacer-2-5)}}&[borderless]:not([borderless=false])+propskit-group{box-shadow:none;&:not([name]){padding-top:0}}&[compact]:not([compact=false])>fig-header{--fig-header-height:var(--spacer-5);height:var(--fig-header-height)}&>fig-header{cursor:default;gap:0;&:focus-visible{--figma-focus-outline-radius:var(--radius-medium);outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset);border-radius:var(--figma-focus-outline-radius)}&>h3{text-overflow:ellipsis;white-space:nowrap;user-select:none;flex:auto;min-width:0;max-width:100%;margin:0;padding-left:0;display:block;overflow:hidden}&>.propskit-group-chevron{--icon:var(--icon-16-chevron);--size:1rem;color:var(--figma-color-text-tertiary);transition:transform var(--transition-duration) var(--transition-timing-function);margin-left:calc(var(--spacer-2) * -1);flex:none;transform:rotate(-90deg)}}&:not([open]):not([open=true]),&[open=false]{margin-bottom:0;&>fig-header{color:var(--figma-color-text-secondary);&:hover{color:var(--figma-color-text);& .propskit-group-chevron{color:inherit}}}&>:not(fig-header){display:none}}&[open]:not([open=false])>fig-header .propskit-group-chevron{transform:rotate(0)}&>fig-header>.propskit-group-reset-tooltip{opacity:0;visibility:hidden;pointer-events:none;color:var(--figma-color-icon-tertiary);transition:opacity var(--transition-duration) var(--transition-timing-function), visibility var(--transition-duration) var(--transition-timing-function), color var(--transition-duration) var(--transition-timing-function);flex-shrink:0;& fig-icon{color:var(--figma-color-icon-tertiary)}&:hover,&:focus-within{& fig-icon{color:var(--figma-color-icon-primary,var(--figma-color-icon))}}}&[data-dirty]:not([data-dirty=false]):not([show-reset=false])>fig-header>.propskit-group-reset-tooltip:not([hidden]){opacity:1;visibility:visible;pointer-events:auto}&[show-reset=false]>fig-header>.propskit-group-reset-tooltip{display:none}}main:has(>propskit-group[name]:first-child),fig-content:has(>propskit-group[name]:first-child){padding-top:0}main:has(>propskit-group[name]:last-child),fig-content:has(>propskit-group[name]:last-child){padding-bottom:0}:is(propskit-switch,propskit-color,propskit-fill,propskit-gradient,propskit-select,propskit-easing,propskit-text,propskit-number,propskit-origin,propskit-position,propskit-joystick,propskit-spring,propskit-color-point,propskit-point-radius,propskit-point-radius-angle,propskit-point-point,propskit-group,propskit-slider,propskit-wheel,propskit-oscillator) :is(fig-input-text,fig-input-number)[disabled]:not([disabled=false]){box-shadow:none;background:0 0;border:0}propskit-switch{--propskit-switch-height:2rem;--_propskit-padding-block:var(--propskit-switch-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-switch-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-switch-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-switch-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-switch-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-switch-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-switch-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-switch-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-switch-label-inline-size,var(--propskit-label-inline-size,75%));--_propskit-input-inline-size:var(--propskit-switch-input-inline-size,var(--propskit-input-inline-size,var(--_propskit-switch-control-inline-size,2rem)));box-sizing:border-box;width:100%;height:calc(var(--propskit-switch-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&[variant=segmented-control]{--_propskit-switch-control-inline-size:4.5rem}&:not([variant=segmented-control]) .propskit-switch-surface{padding-inline-end:var(--spacer-2)}&[disabled]:not([disabled=false]){pointer-events:none;& label{color:var(--figma-color-text-disabled)}}& .propskit-switch-surface{height:100%;padding-inline:var(--spacer-2-5) var(--spacer-1);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);cursor:default;align-items:center;display:flex;position:relative;&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;min-width:0;max-inline-size:var(--_propskit-label-inline-size);color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:auto;align-items:center;margin:0;display:flex;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& :is(fig-switch,fig-segmented-control){inline-size:var(--_propskit-input-inline-size);min-inline-size:var(--_propskit-input-inline-size);flex:none;margin-inline-start:auto}& fig-switch{justify-content:flex-end;padding-block:0}}}propskit-color{--_propskit-padding-block:var(--propskit-color-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-color-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-color-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-color-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-color-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-color-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-color-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-color-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-color-label-inline-size,var(--propskit-label-inline-size,40%));--_propskit-input-inline-size:var(--propskit-color-input-inline-size,var(--propskit-input-inline-size,33%))}propskit-fill{--_propskit-padding-block:var(--propskit-fill-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-fill-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-fill-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-fill-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-fill-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-fill-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-fill-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-fill-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-fill-label-inline-size,var(--propskit-label-inline-size,40%));--_propskit-input-inline-size:var(--propskit-fill-input-inline-size,var(--propskit-input-inline-size,33%))}propskit-color,propskit-fill{--propskit-color-height:2rem;--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-color-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&[disabled]:not([disabled=false]){pointer-events:none;& label{color:var(--figma-color-text-disabled)}}& :is(.propskit-color-surface,.propskit-fill-surface){align-items:center;gap:var(--spacer-2);height:100%;border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);padding-inline-start:var(--spacer-2-5);display:flex;position:relative;&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;max-inline-size:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:0 auto;align-items:center;margin:0;padding:0;display:flex;position:relative;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-fill-picker{display:contents}& fig-swatch{flex:0 0 var(--_propskit-input-inline-size);inline-size:var(--_propskit-input-inline-size);contain:paint;--width:100%;--height:var(--propskit-color-height);--size:var(--propskit-color-height);--border-radius:var(--radius-medium);min-width:0;height:var(--propskit-color-height);border-radius:var(--radius-medium);margin-inline-start:auto;position:relative;overflow:hidden}}}propskit-gradient{--propskit-gradient-height:2rem;--_propskit-padding-block:var(--propskit-gradient-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-gradient-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-gradient-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-gradient-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-gradient-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-gradient-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-gradient-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-gradient-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-gradient-label-inline-size,var(--propskit-label-inline-size,40%));--_propskit-input-inline-size:var(--propskit-gradient-input-inline-size,var(--propskit-input-inline-size,33%));--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-gradient-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;& fig-input-gradient{--fig-input-gradient-height:var(--propskit-gradient-height);--fig-input-gradient-swatch-border-radius:var(--radius-medium);height:var(--propskit-gradient-height);& fig-swatch{--height:var(--propskit-gradient-height);--size:var(--propskit-gradient-height);height:var(--propskit-gradient-height)}}&[disabled]:not([disabled=false]){pointer-events:none;& label{color:var(--figma-color-text-disabled)}}& .propskit-gradient-surface{align-items:center;gap:var(--spacer-2);height:100%;border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);padding-inline-start:var(--spacer-2-5);display:flex;position:relative;&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;max-inline-size:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:0 auto;align-items:center;margin:0;padding:0;display:flex;position:relative;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-input-gradient{flex:0 0 var(--_propskit-input-inline-size);inline-size:var(--_propskit-input-inline-size);border-radius:var(--radius-medium);background-color:#0000;min-width:0;margin-inline-start:auto;position:relative}}}:is(propskit-color,propskit-fill,propskit-gradient){outline:none;& fig-swatch{--border-radius:var(--radius-medium);--fig-swatch-border-radius:var(--radius-medium);border-radius:var(--radius-medium);background-color:#0000!important}& :is(.propskit-color-surface,.propskit-fill-surface,.propskit-gradient-surface){outline:none}&:focus-within :is(.propskit-color-surface,.propskit-fill-surface,.propskit-gradient-surface),&.has-popup-open :is(.propskit-color-surface,.propskit-fill-surface,.propskit-gradient-surface){outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}& :is(fig-swatch,fig-chit,fig-input-gradient,fig-input-fill,fig-fill-picker){--selected:0!important;&:hover,&:focus,&:active,&:focus-within:not(:focus){outline:0!important}&:focus-within:not(:focus) :is(input,fig-swatch,fig-chit){outline-offset:0!important;outline:0!important}}& input[type=color]:is(:focus,:focus-visible){outline-offset:0!important;outline:0!important}}propskit-palette{--propskit-palette-height:2rem;--_propskit-padding-block:var(--propskit-palette-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-palette-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-palette-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-palette-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-palette-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-palette-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-palette-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-palette-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-palette-label-inline-size,var(--propskit-label-inline-size,40%));--_propskit-input-inline-size:var(--propskit-palette-input-inline-size,var(--propskit-input-inline-size,60%));--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-palette-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&[disabled]:not([disabled=false]){pointer-events:none;& label{color:var(--figma-color-text-disabled)}}& .propskit-palette-surface{align-items:center;gap:var(--spacer-2);box-sizing:border-box;height:100%;border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);cursor:default;padding-inline-start:var(--spacer-2-5);display:flex;position:relative;&:after{content:"";border:var(--_propskit-border);border-radius:inherit;pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&:focus-within{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&>label{z-index:1;max-inline-size:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:0 auto;align-items:center;margin:0;padding:0;display:flex;position:relative;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}&>fig-select{--fig-select-trigger-width:100%;z-index:1;border-radius:inherit;width:100%;min-width:0;max-width:none;height:100%;box-shadow:none;background:0 0;margin:0;display:flex;position:absolute;inset:0;&::part(trigger){gap:var(--spacer-1);min-width:0;padding-left:calc(var(--_propskit-label-inline-size) + var(--spacer-2));background:0 0}&::part(prepend){flex:auto;min-width:0;margin:0;display:flex}}}& .propskit-palette-preview{--fig-input-palette-height:calc(var(--propskit-palette-height) - var(--spacer-2));--fig-input-palette-padding:0px;border-radius:var(--radius-medium);opacity:1;pointer-events:none;width:100%;min-width:0;&[hidden]{display:none!important}&>.palette-colors-inline{border-radius:var(--radius-medium);background:0 0;padding:0;&>.palette-colors{border-radius:var(--radius-medium)}}}& .propskit-palette-options{& fig-select-option{min-height:var(--propskit-palette-height);cursor:default;&>.propskit-palette-option-preview{flex:auto;min-width:0;margin-block:0;margin-inline-end:0;display:flex}& .propskit-palette-preview{--fig-input-palette-height:var(--spacer-4);--fig-input-palette-padding:0px}}}}propskit-select{--propskit-select-height:2rem;--_propskit-padding-block:var(--propskit-select-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-select-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-select-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-select-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-select-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-select-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-select-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-select-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-select-label-inline-size,var(--propskit-label-inline-size,75%));--_propskit-input-inline-size:var(--propskit-select-input-inline-size,var(--propskit-input-inline-size,100%));--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-select-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;& .propskit-select-surface{& fig-select{padding-right:var(--spacer-1);&:after{right:calc(.25rem + var(--spacer-1))}}& fig-select::part(trigger){padding-left:var(--spacer-2-5)}}&[disabled]:not([disabled=false]){pointer-events:none;& label{color:var(--figma-color-text-disabled)}}& .propskit-select-surface{border-radius:var(--radius-medium-large);background:var(--_propskit-background);height:100%;color:var(--_propskit-color);align-items:center;padding:0;display:flex;position:relative;&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-select{inline-size:var(--_propskit-input-inline-size);border-radius:inherit;min-width:0;height:100%;box-shadow:none;background:0 0;flex:auto;align-self:stretch;align-items:stretch;display:flex;position:relative}& fig-select{--fig-select-trigger-width:100%;&::part(label){text-align:right}}}}propskit-text{--propskit-text-height:2rem;--_propskit-padding-block:var(--propskit-text-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-text-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-text-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-text-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-text-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-text-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-text-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-text-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-text-label-inline-size,var(--propskit-label-inline-size,50%));--_propskit-input-inline-size:var(--propskit-text-input-inline-size,var(--propskit-input-inline-size,fit-content));--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;min-height:calc(var(--propskit-text-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&[disabled]:not([disabled=false]){pointer-events:none;& label,& :is(input,textarea){color:var(--figma-color-text-disabled)}}& .propskit-text-surface{align-items:center;gap:var(--spacer-2);box-sizing:border-box;min-height:var(--propskit-text-height);padding-block:var(--spacer-1);padding-inline:var(--spacer-2-5) var(--spacer-1);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);outline:none;display:flex;position:relative;&:focus-within{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;min-width:0;margin:var(--spacer-1) 0 0;max-inline-size:var(--_propskit-label-inline-size);color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:none;align-self:flex-start;align-items:center;padding:0;display:flex;position:relative;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-input-text{--figma-focus-outline-offset:1px;min-width:0;max-width:none;min-height:var(--control-height);border-radius:var(--radius-medium);box-shadow:none;background-color:#0000;align-self:center;margin-inline-start:auto;position:relative;width:var(--_propskit-input-inline-size)!important;outline:none!important;flex:0 auto!important;&:has(:is(input,textarea):focus){outline:none!important}& :is(input,textarea){text-align:right;flex:none;width:auto;min-width:0;max-width:100%}& input:not(:focus){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}& textarea{min-height:1lh;max-height:calc(4lh + var(--spacer-2));white-space:pre-wrap;overflow-y:auto}}}}propskit-number{--propskit-number-height:2rem;--_propskit-padding-block:var(--propskit-number-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-number-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-number-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-number-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-number-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-number-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-number-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-number-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-number-label-inline-size,var(--propskit-label-inline-size,75%));--_propskit-input-inline-size:var(--propskit-number-input-inline-size,var(--propskit-input-inline-size,fit-content));--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-number-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&[disabled]:not([disabled=false]){pointer-events:none;& label,& input{color:var(--figma-color-text-disabled)}}&[steppers]:not([steppers=false]) fig-input-number input{padding-right:0}& .propskit-number-surface{align-items:center;gap:var(--spacer-2);box-sizing:border-box;height:100%;padding-inline:var(--spacer-2-5) var(--spacer-1);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);outline:none;display:flex;position:relative;&:focus-within{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;min-width:0;max-inline-size:var(--_propskit-label-inline-size);color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:none;align-items:center;padding:0;display:flex;position:relative;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-input-number{--figma-focus-outline-offset:1px;min-width:0;max-width:none;height:var(--control-height);border-radius:var(--radius-medium);box-shadow:none;background-color:#0000;align-self:center;margin-inline-start:auto;position:relative;width:var(--_propskit-input-inline-size)!important;outline:none!important;flex:0 auto!important;&:has(input:focus){outline:none!important}& input{field-sizing:content;text-align:right;font-variant-numeric:tabular-nums;flex:none;width:auto;min-width:0;max-width:100%}}}}propskit-slider{--propskit-slider-elastic-distance:calc(var(--spacer-2) + .25rem);--propskit-slider-elastic-size:0px;--propskit-slider-elastic-scale:1;--propskit-slider-elastic-origin:left center;--propskit-slider-elastic-transition:.18s cubic-bezier(.2, 1.45, .35, 1);--propskit-slider-height:2rem;--_propskit-padding-block:var(--propskit-slider-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-slider-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-slider-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-slider-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-slider-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-slider-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-slider-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-slider-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-slider-label-inline-size,var(--propskit-label-inline-size,75%));--_propskit-input-inline-size:var(--propskit-slider-input-inline-size,var(--propskit-input-inline-size,100%));--figma-focus-outline-offset:1px;--propskit-slider-progress-shadow:inset 0px .75px 0px 0px light-dark(#0000,#ffffff1a);--field-text-shadow:0 1px 1.5px light-dark(#0003,#0003);--propskit-slider-fig-slider-height:var(--propskit-slider-height);--propskit-slider-fig-slider-thumb-height:calc(var(--propskit-slider-fig-slider-height) - var(--spacer-3));--propskit-slider-number-right:calc(2px + var(--spacer-1));--propskit-slider-handle-fade-start-threshold:var(--spacer-3);--propskit-slider-handle-fade-end-threshold:var(--spacer-2);--propskit-slider-handle-proximity:1;--propskit-slider-handle-reveal:0;--propskit-slider-handle-scale:var(--propskit-slider-handle-proximity);--propskit-slider-handle-color:light-dark(#222,var(--figma-color-text));box-sizing:border-box;width:100%;height:calc(var(--propskit-slider-height) + var(--_propskit-padding-block) * 2);border-radius:var(--radius-medium-large);transform-origin:var(--propskit-slider-elastic-origin);transition:transform var(--propskit-slider-elastic-transition);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;position:relative;&:hover,&:focus-within{--propskit-slider-handle-reveal:1}& label{pointer-events:none;z-index:1}&[disabled]:not([disabled=false]){pointer-events:none;& label,& input{color:var(--figma-color-text-disabled)}& fig-slider{filter:grayscale()opacity(.5)}}&[type=hue]{& label,& input{color:var(--propskit-slider-filled-text-color,var(--figma-color-text-oninverse))!important}}&[type=opacity] fig-slider{--slider-checkerboard:var(--checkerboard)}& .propskit-slider-surface{border-radius:var(--figma-focus-outline-radius);background:var(--_propskit-background);height:100%;color:var(--_propskit-color);outline:none;padding-inline-start:var(--spacer-2-5);display:flex;position:relative;&:focus-within{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&>label{min-width:0;max-width:var(--_propskit-label-inline-size);width:var(--_propskit-label-inline-size);color:inherit;align-items:center;gap:var(--spacer-1);flex:auto;height:100%;margin:0;display:flex;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-slider{inline-size:var(--_propskit-input-inline-size);border-radius:inherit;--slider-height:var(--propskit-slider-fig-slider-height);background-color:#0000;outline:none;padding:0;position:absolute;inset-block:0;inset-inline-end:0;&:focus-within,&:has(input[type=range]:focus-visible){outline:none}--slider-field-height:var(--propskit-slider-height);--slider-thumb-width:var(--spacer-1);--slider-thumb-color:var(--propskit-slider-handle-color);--slider-thumb-height:var(--propskit-slider-fig-slider-thumb-height);--slider-border-radius:var(--radius-medium-large);--slider-tick-width:.125rem;--slider-tick-height:var(--spacer-2);--slider-tick-radius:var(--radius-medium);--slider-stepper-padding:0;--propskit-slider-thumb-inset:var(--spacer-2);--propskit-slider-progress-percent:var(--slider-percent);--propskit-slider-thumb-travel-offset:calc((var(--slider-complete) - 1) * var(--slider-thumb-width) - var(--propskit-slider-thumb-inset));--slider-thumb-opacity:calc(var(--propskit-slider-handle-proximity) * var(--propskit-slider-handle-proximity) * var(--propskit-slider-handle-reveal));--slider-tick-opacity:.5;--slider-handle-shadow:inset 0 0 0 var(--slider-thumb-height) var(--slider-thumb-color)!important;&[type=delta],&[type=stepper],&[type=hue]{--propskit-slider-thumb-inset:0}&[type=stepper]{& datalist{opacity:0}&:hover,&:focus-within{& datalist{opacity:1}}}&[type=stepper] .fig-slider-input-container input[type=range]{margin-left:0;width:100%!important}& .fig-slider-input-container{overflow:hidden;box-shadow:none!important;background-color:var(--_propskit-background)!important;&:after{border:var(--_propskit-border)}&:hover,&:focus-within{color:var(--_propskit-hover-color);background-color:var(--_propskit-hover-background)!important;&:after{content:"";pointer-events:none;border-radius:var(--slider-border-radius);border:var(--_propskit-hover-border);position:absolute;inset:0;box-shadow:none!important}}&:before{box-shadow:var(--propskit-slider-progress-shadow)!important;background:var(--figma-color-bordertranslucent)!important;min-width:0!important;box-shadow:none!important}& input[type=range]{margin-left:0;border-radius:0!important;width:100%!important;&::-webkit-slider-thumb{margin-left:var(--propskit-slider-thumb-travel-offset)}&::-moz-range-thumb{margin-left:var(--propskit-slider-thumb-travel-offset)}}}&:not([type=delta]) .fig-slider-input-container:before{max-width:100%;width:var(--propskit-slider-progress-percent)!important}&[type=delta] .fig-slider-input-container:before{background:var(--figma-color-bordertranslucent)!important;--left-start:calc(var(--start-percent) - var(--slider-thumb-width) / 2)!important;left:min(var(--left-start), calc(var(--slider-percent) - var(--slider-complete) * var(--slider-thumb-width)))!important;--width:calc(var(--slider-percent) - var(--start-percent))!important;--abs-width:max(calc(var(--width) + var(--slider-thumb-width) / 2 + (1 - var(--slider-complete)) * var(--slider-thumb-width)), calc(-1 * var(--width) + var(--slider-thumb-width) / 2 + var(--slider-complete) * var(--slider-thumb-width)))!important;width:var(--abs-width)!important}&:is([type=hue],[type=opacity]){& .fig-slider-input-container{&:after{content:"";z-index:0;pointer-events:none;border-radius:var(--slider-border-radius);position:absolute;inset:0}& input[type=range]{z-index:1;position:relative;&::-webkit-slider-runnable-track{background:0 0}&::-moz-range-track{background:0 0}}}}&[type=hue] .fig-slider-input-container{--propskit-slider-hue-color:hsl(calc(var(--slider-complete) * 360deg) 100% 50%);background:var(--propskit-slider-hue-color)!important;&:after{box-sizing:border-box;background:var(--bg-hue);border:0;border-radius:0;height:3px;inset:auto 0 0;-webkit-mask-image:none;mask-image:none;box-shadow:none!important}}&[type=opacity] .fig-slider-input-container{--propskit-slider-opacity-color:color-mix(in srgb, var(--color) calc(var(--slider-complete) * 100%), transparent);--propskit-slider-strip-effective-color:color-mix(in srgb, var(--color) calc(var(--slider-complete) * 100%), var(--figma-color-bg-secondary));--propskit-slider-strip-border-color:light-dark(oklch(from var(--propskit-slider-strip-effective-color) clamp(0, calc(l - .08), .85) c h),oklch(from var(--propskit-slider-strip-effective-color) clamp(.4, calc(l + .08), 1) c h));&:before{opacity:1;display:block;box-shadow:none!important;background:linear-gradient(var(--propskit-slider-opacity-color), var(--propskit-slider-opacity-color)), var(--slider-checkerboard)!important}&:after{box-sizing:border-box;width:var(--propskit-slider-progress-percent);border:1px solid var(--propskit-slider-strip-border-color);mix-blend-mode:normal;opacity:clamp(0, var(--slider-complete) * 1000, 1);background:0 0;inset:0 auto 0 0;box-shadow:none!important}}}& datalist{mask-image:linear-gradient(to right, transparent 0, transparent var(--spacer-4), white, transparent calc(100% - var(--spacer-4)), transparent 100%)}& fig-input-number{right:var(--propskit-slider-number-right);z-index:2;height:var(--control-height);border-radius:var(--radius-medium);background-color:#0000;border-left:0;flex:none;width:fit-content;min-width:fit-content;max-width:max-content;position:absolute;top:50%;bottom:auto;transform:translateY(-50%);box-shadow:none!important;outline:none!important;&:hover,&:has(input:focus){box-shadow:none!important;outline:none!important}& input{field-sizing:content;font-variant-numeric:tabular-nums;border-radius:var(--radius-medium);text-align:right;width:auto;color:var(--field-text-color);cursor:ew-resize;touch-action:none;flex:none;&:focus{cursor:text;touch-action:auto}}}}&[type=opacity][color]{& fig-slider{container-type:inline-size}& .propskit-slider-surface>label{--propskit-slider-label-fill-edge:clamp(0%, calc(var(--propskit-slider-complete,0) * 133.333%), 100%);background-image:linear-gradient(to right, var(--propskit-slider-filled-text-color) 0 var(--propskit-slider-label-fill-edge), var(--figma-color-text-secondary) var(--propskit-slider-label-fill-edge) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;color:#0000!important}& fig-input-number[theme] input{--propskit-slider-number-fill-edge:clamp(0px, calc(100% + var(--propskit-slider-number-right) - (1 - var(--slider-complete)) * 100cqw), 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(to right, var(--propskit-slider-filled-text-color) 0 var(--propskit-slider-number-fill-edge), var(--figma-color-text) var(--propskit-slider-number-fill-edge) 100%)!important;color:#0000!important}}&[data-elastic-dragging=true]{transform:scaleX(var(--propskit-slider-elastic-scale));transition:none}}propskit-slider input[type=range]:active::-webkit-slider-thumb{cursor:ew-resize}propskit-slider input[type=range]:active::-moz-range-thumb{cursor:ew-resize}propskit-slider input[type=range]::-webkit-slider-thumb{transform:scale(var(--propskit-slider-handle-scale));transform-origin:50%}propskit-slider input[type=range]::-moz-range-thumb{transform:scale(var(--propskit-slider-handle-scale));transform-origin:50%}fig-input-wheel{--fig-input-wheel-handle-drag-max:.5rem;--fig-input-wheel-handle-drag-offset:0px;--fig-input-wheel-handle-spring:.28s cubic-bezier(.34, 1.56, .64, 1);--fig-input-wheel-keyboard-handle-spring:.14s cubic-bezier(.34, 1.56, .64, 1);--fig-input-wheel-tick-width:.125rem;--fig-input-wheel-tick-width-min:1px;--fig-input-wheel-tick-height:calc(var(--fig-input-wheel-handle-height) - 4px);--fig-input-wheel-tick-height-min:8px;--fig-input-wheel-tick-fade:1rem;--fig-input-wheel-tick-opacity:.5;--fig-input-wheel-tick-opacity-min:.1;--fig-input-wheel-fast-tick-blur:2px;--fig-input-wheel-handle-width:var(--spacer-1);--fig-input-wheel-handle-height:calc(var(--control-height) - var(--spacer-2));--fig-input-wheel-handle-color:light-dark(var(--figma-color-text-secondary),var(--figma-color-text));box-sizing:border-box;width:100%;height:var(--control-height);border-radius:var(--radius-medium);background-color:var(--figma-color-bg-secondary);cursor:ew-resize;outline:none;display:block;position:relative;&:focus-visible{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&[disabled]:not([disabled=false]){pointer-events:none;opacity:.5}& .fig-input-wheel-svg{width:calc(100% - var(--spacer-3));height:100%;margin-inline:var(--spacer-2);color:var(--figma-color-icon-tertiary);mask-image:linear-gradient(to right, rgb(0 0 0/var(--fig-input-wheel-tick-opacity-min)) 0, rgb(0 0 0/var(--fig-input-wheel-tick-opacity)) var(--fig-input-wheel-tick-fade), rgb(0 0 0/var(--fig-input-wheel-tick-opacity)) calc(100% - var(--fig-input-wheel-tick-fade)), rgb(0 0 0/var(--fig-input-wheel-tick-opacity-min)) 100%);display:block;overflow:visible}& .fig-input-wheel-tick{fill:currentColor;stroke:none;transition:filter .12s ease-out}& .fig-input-wheel-handle{z-index:1;width:var(--fig-input-wheel-handle-width);height:var(--fig-input-wheel-handle-height);border-radius:calc(var(--fig-input-wheel-handle-width) / 2);pointer-events:none;transform:translate(calc(-50% + var(--fig-input-wheel-handle-drag-offset)), -50%);transition:transform var(--fig-input-wheel-handle-spring);box-shadow:inset 0 0 0 var(--fig-input-wheel-handle-height) var(--fig-input-wheel-handle-color);background:0 0;position:absolute;top:50%;left:50%}&[data-fig-input-wheel-active] .fig-input-wheel-handle{transition:none}&[data-fig-input-wheel-fast] .fig-input-wheel-tick{filter:blur(var(--fig-input-wheel-fast-tick-blur));transition:none}&[data-fig-input-wheel-keyboard-moving] .fig-input-wheel-handle{transition:none}&[data-fig-input-wheel-keyboard-settling] .fig-input-wheel-handle{transition:transform var(--fig-input-wheel-keyboard-handle-spring)}}propskit-wheel{--propskit-wheel-elastic-distance:calc(var(--spacer-2) + .25rem);--propskit-wheel-elastic-scale:1;--propskit-wheel-elastic-origin:left center;--propskit-wheel-elastic-transition:.28s cubic-bezier(.34, 1.56, .64, 1);--propskit-wheel-height:2rem;--_propskit-padding-block:var(--propskit-wheel-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-wheel-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-wheel-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-wheel-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-wheel-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-wheel-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-wheel-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-wheel-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-wheel-label-inline-size,var(--propskit-label-inline-size,75%));--_propskit-input-inline-size:var(--propskit-wheel-input-inline-size,var(--propskit-input-inline-size,fit-content));--propskit-wheel-number-right:calc(2px + var(--spacer-1));--propskit-wheel-track-inset:3rem;--propskit-wheel-track-inset-left:var(--propskit-wheel-track-inset);--propskit-wheel-track-inset-right:var(--propskit-wheel-track-inset);--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-wheel-height) + var(--_propskit-padding-block) * 2);transform-origin:var(--propskit-wheel-elastic-origin);transition:transform var(--propskit-wheel-elastic-transition);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;position:relative;&[data-label-empty]{--propskit-wheel-track-inset-left:var(--spacer-2)}&[text=false]{--propskit-wheel-track-inset-right:var(--spacer-2)}&[disabled]:not([disabled=false]){pointer-events:none;& label,& input{color:var(--figma-color-text-disabled)}}& .propskit-wheel-surface{box-sizing:border-box;border-radius:var(--radius-medium-large);background:var(--_propskit-background);width:100%;height:100%;color:var(--_propskit-color);cursor:ew-resize;touch-action:none;user-select:none;display:block;position:relative;overflow:hidden;&:focus-within{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;box-sizing:border-box;width:var(--_propskit-label-inline-size);max-width:var(--_propskit-label-inline-size);color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;align-content:center;padding-inline-start:var(--spacer-2-5);display:block;position:absolute;inset:0;overflow:hidden}}& .propskit-wheel-surface>fig-input-wheel{--fig-input-wheel-handle-height:calc(var(--propskit-wheel-height) - var(--spacer-3));inset:0 var(--propskit-wheel-track-inset-right) 0 var(--propskit-wheel-track-inset-left);z-index:0;background-color:#0000;outline:none;width:auto;height:100%;transition:none;position:absolute;transform:none}& fig-input-number{font-variant-numeric:var(--font-variant-numeric);inset-inline-end:var(--propskit-wheel-number-right);z-index:2;height:var(--control-height);width:var(--_propskit-input-inline-size);border-radius:var(--radius-medium);background-color:#0000;border:0;flex:none;min-width:fit-content;max-width:max-content;position:absolute;top:50%;bottom:auto;transform:translateY(-50%);box-shadow:none!important;outline:none!important;&:hover,&:has(input:focus){box-shadow:none!important;outline:none!important}& input{field-sizing:content;text-align:right;cursor:ew-resize;touch-action:none;user-select:text;flex:none;width:auto;&:focus{cursor:text;touch-action:auto}}}&[data-propskit-wheel-elastic-dragging]{transform:scaleX(var(--propskit-wheel-elastic-scale));transition:none}}body.fig-input-wheel-dragging,body.fig-input-wheel-dragging *,body.propskit-slider-dragging,body.propskit-slider-dragging *{cursor:grabbing!important;-webkit-user-select:none!important;user-select:none!important}@media (prefers-reduced-motion:reduce){propskit-wheel,fig-input-wheel .fig-input-wheel-tick,fig-input-wheel .fig-input-wheel-handle{transition:none}}:is(.propskit-switch-surface,.propskit-color-surface,.propskit-fill-surface,.propskit-gradient-surface,.propskit-select-surface,.propskit-slider-surface)>label{z-index:1;box-sizing:border-box;width:var(--_propskit-label-inline-size);max-width:var(--_propskit-label-inline-size);text-overflow:ellipsis;white-space:nowrap;pointer-events:none;align-content:center;padding-inline-start:var(--spacer-2-5);display:block;position:absolute;inset:0;overflow:hidden}propskit-color-point,propskit-point-point,propskit-point-radius,propskit-point-radius-angle{display:contents}propskit-position{--propskit-position-height:2rem;--_propskit-padding-block:var(--propskit-position-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-position-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-position-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-position-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-position-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-position-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-position-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-position-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-position-label-inline-size,var(--propskit-label-inline-size,auto));--_propskit-input-inline-size:var(--propskit-position-input-inline-size,var(--propskit-input-inline-size,3.85rem));--figma-focus-outline-offset:1px;gap:var(--spacer-1);box-sizing:border-box;width:100%;padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);flex-direction:column;display:flex;&[disabled]:not([disabled=false]){pointer-events:none;& .propskit-position-surface>label{color:var(--figma-color-text-disabled)}}& .propskit-position-surface{box-sizing:border-box;width:100%;min-width:0;height:var(--propskit-position-height);min-height:var(--propskit-position-height);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);align-items:center;padding-inline-start:var(--spacer-2-5);display:flex;position:relative;&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;inline-size:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:auto;align-items:center;margin:0 auto 0 0;padding:0;display:flex;position:relative;overflow:hidden}&>[data-propskit-position-axis]{z-index:1;flex:0 auto;min-width:0;position:relative}}& fig-input-number{width:var(--_propskit-input-inline-size);height:var(--control-height);box-shadow:none;background-color:#0000;border:0;outline:none!important;&:hover,&:focus-within{box-shadow:none;background-color:#0000;border:0;outline:none!important}}& fig-input-number[data-propskit-position-axis=y]{margin-left:calc(-1 * var(--spacer-2))}}propskit-joystick{--_propskit-padding-block:var(--propskit-joystick-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-joystick-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-joystick-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-joystick-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-joystick-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-joystick-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-joystick-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-joystick-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-joystick-label-inline-size,var(--propskit-label-inline-size,100%));--_propskit-input-inline-size:var(--propskit-joystick-input-inline-size,var(--propskit-input-inline-size,100%));box-sizing:border-box;width:100%;padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;& .propskit-joystick-surface{align-items:stretch;gap:var(--spacer-2);box-sizing:border-box;width:100%;min-width:0;padding:var(--spacer-2);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);flex-direction:column;display:flex;position:relative;&:after{content:"";border:var(--_propskit-border);border-radius:inherit;pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{width:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;margin:0;padding:0;padding-inline-start:calc(var(--spacer-2-5) - var(--spacer-2));display:block;overflow:hidden}}& fig-joystick{--size:100%;width:var(--_propskit-input-inline-size);align-self:flex-end;min-width:0;& .fig-input-joystick-guides{background-color:var(--propskit-bg-subfield,#ffffff0d);--figma-color-border:var(--propskit-color-border-subfield,var(--figma-color-bordertranslucent))}& .joystick-values>fig-input-number{background-color:var(--propskit-bg-subfield,#ffffff0d);box-shadow:none;border:0}& .fig-joystick-reset{display:none}}&[variant=minimal] .propskit-joystick-surface{background:0 0}&[disabled]:not([disabled=false]){& .propskit-joystick-surface{color:var(--figma-color-text-disabled)}& fig-joystick{filter:grayscale();opacity:.5}}}propskit-origin{--_propskit-padding-block:var(--propskit-origin-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-origin-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-origin-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-origin-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-origin-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-origin-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-origin-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-origin-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-origin-label-inline-size,var(--propskit-label-inline-size,100%));--_propskit-input-inline-size:var(--propskit-origin-input-inline-size,var(--propskit-input-inline-size,100%))}propskit-easing{--_propskit-padding-block:var(--propskit-easing-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-easing-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-easing-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-easing-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-easing-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-easing-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-easing-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-easing-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-easing-label-inline-size,var(--propskit-label-inline-size,100%));--_propskit-input-inline-size:var(--propskit-easing-input-inline-size,var(--propskit-input-inline-size,100%))}propskit-spring{--_propskit-padding-block:var(--propskit-spring-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-spring-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-spring-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-spring-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-spring-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-spring-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-spring-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-spring-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-spring-label-inline-size,var(--propskit-label-inline-size,100%));--_propskit-input-inline-size:var(--propskit-spring-input-inline-size,var(--propskit-input-inline-size,100%))}:is(propskit-origin,propskit-easing,propskit-spring){box-sizing:border-box;width:100%;padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&>:is(.propskit-origin-surface,.propskit-easing-surface,.propskit-spring-surface){align-items:stretch;gap:var(--spacer-2);box-sizing:border-box;width:100%;min-width:0;padding:var(--spacer-2);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);flex-direction:column;display:flex;position:relative;&:after{content:"";border:var(--_propskit-border);border-radius:inherit;pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{width:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;margin:0;padding:0;padding-inline-start:calc(var(--spacer-2-5) - var(--spacer-2));display:block;overflow:hidden}}&[variant=minimal]>:is(.propskit-origin-surface,.propskit-easing-surface,.propskit-spring-surface){background:0 0}&[disabled]:not([disabled=false]){&>:is(.propskit-origin-surface,.propskit-easing-surface,.propskit-spring-surface){color:var(--figma-color-text-disabled)}& :is(fig-origin-grid,fig-easing-curve){filter:grayscale();opacity:.5}}}propskit-origin{& fig-origin-grid{--figma-color-border:var(--propskit-color-border-subfield,var(--figma-color-bordertranslucent));width:var(--_propskit-input-inline-size);align-self:flex-end;min-width:0;& .origin-grid,& .origin-values>fig-input-number{background-color:var(--propskit-bg-subfield,#ffffff0d)}}}:is(propskit-easing,propskit-spring){& fig-easing-curve{--figma-color-border:var(--propskit-color-border-subfield,var(--figma-color-bordertranslucent));width:var(--_propskit-input-inline-size);align-self:flex-end;min-width:0;& .fig-easing-curve-svg-container,& .fig-easing-curve-value-input{background-color:var(--propskit-bg-subfield,#ffffff0d)}& .fig-easing-curve-boundary,& .fig-easing-curve-target{stroke:var(--propskit-color-border-subfield,var(--figma-color-bordertranslucent))}}}:is(propskit-easing,propskit-spring) fig-easing-curve .fig-easing-curve-select{background-color:var(--propskit-bg-subfield,#ffffff0d);&:hover:not([disabled]):not([disabled=false]){background-color:var(--propskit-bg-subfield,#ffffff0d)}}:is(propskit-number,propskit-position,propskit-joystick,propskit-origin) fig-input-number:is(:focus-within,:active,:has(input:active)),propskit-text fig-input-text:is(:focus-within,:active,:has(:is(input,textarea):active)),:is(propskit-slider,propskit-wheel) fig-input-number:has(input:focus){background-color:var(--figma-color-bg)}:is(propskit-palette,propskit-select,propskit-text,propskit-number,propskit-slider,propskit-wheel) :is(.propskit-palette-surface,.propskit-select-surface,.propskit-text-surface,.propskit-number-surface,.propskit-slider-surface,.propskit-wheel-surface):focus-within,:is(propskit-color,propskit-fill,propskit-gradient):is(:focus-within,.has-popup-open) :is(.propskit-color-surface,.propskit-fill-surface,.propskit-gradient-surface){outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset);outline-color:#0000;overflow:visible;&:before{content:"";inset:calc(-1px - var(--figma-focus-outline-offset));box-sizing:border-box;border:var(--figma-focus-outline);border-radius:calc(var(--figma-focus-outline-radius) + var(--figma-focus-outline-offset) + 1px);pointer-events:none;z-index:4;position:absolute}}:is(.propskit-palette-surface,.propskit-select-surface) fig-select::part(trigger){outline:none}body{--fig-lab-cursor:url("data:image/svg+xml,<svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g clip-path=\"url(%23clip0_20065_231516)\"><g filter=\"url(%23filter0_d_20065_231516)\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2.93938 2.93938C3.35531 2.52345 3.97597 2.38901 4.52673 2.59555L15.5267 6.72055C16.1416 6.95111 16.535 7.55477 16.4976 8.21034C16.4603 8.86592 16.0009 9.421 15.3638 9.58026L10.737 10.737L9.58026 15.3638C9.421 16.0009 8.86592 16.4603 8.21034 16.4976C7.55477 16.535 6.95111 16.1416 6.72055 15.5267L2.59555 4.52673C2.38901 3.97597 2.52345 3.35531 2.93938 2.93938Z\" fill=\"white\"/></g><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4.17558 3.53185C3.99199 3.463 3.7851 3.50782 3.64646 3.64646C3.50782 3.7851 3.463 3.99199 3.53185 4.17558L7.65685 15.1756C7.7337 15.3805 7.93492 15.5117 8.15345 15.4992C8.37197 15.4868 8.557 15.3336 8.61009 15.1213L9.91232 9.91232L15.1213 8.61009C15.3336 8.557 15.4868 8.37197 15.4992 8.15345C15.5117 7.93492 15.3805 7.7337 15.1756 7.65685L4.17558 3.53185Z\" fill=\"black\"/></g><defs><filter id=\"filter0_d_20065_231516\" x=\"-0.5\" y=\"0.5\" width=\"20\" height=\"20\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\"><feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/><feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/><feOffset dy=\"1\"/><feGaussianBlur stdDeviation=\"1.5\"/><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0\"/><feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_20065_231516\"/><feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_20065_231516\" result=\"shape\"/></filter><clipPath id=\"clip0_20065_231516\"><rect width=\"32\" height=\"32\" fill=\"white\"/></clipPath></defs></svg>") 3 3, default;--fig-lab-cursor-eyedropper:url("data:image/svg+xml,<svg width=\"33\" height=\"32\" viewBox=\"0 0 33 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g filter=\"url(%23filter0_d_20089_234507)\"><path d=\"M21.9392 13.4383C23.0416 12.3365 24.8073 12.3025 25.951 13.3347L26.0594 13.4383L26.1629 13.5476C27.1956 14.6911 27.1633 16.4583 26.0603 17.5613L25.118 18.5027C25.9194 19.3681 25.9023 20.7185 25.0613 21.5603L25.0603 21.5613C24.2185 22.4021 22.8681 22.4194 22.0027 21.618L18.1668 25.4549C17.8885 25.7327 17.5329 25.9242 17.1453 26.0017L15.5291 26.325C14.1302 26.6042 12.8971 25.3697 13.1756 23.9715L13.4988 22.3553C13.5763 21.9677 13.7679 21.6121 14.0457 21.3338L17.8806 17.4969C17.0787 16.6304 17.1 15.2789 17.9402 14.4383C18.7815 13.598 20.1303 13.58 20.9959 14.3806L21.9392 13.4383ZM17.4597 24.7469C17.3202 24.8861 17.1423 24.9816 16.949 25.0203L15.3328 25.3435C15.2891 25.3522 15.2458 25.359 15.2029 25.3621C15.2458 25.3593 15.2892 25.3532 15.3328 25.3445L16.949 25.0213C16.9976 25.0116 17.0453 24.998 17.0916 24.9812C17.1376 24.9647 17.1824 24.9447 17.2254 24.9217C17.2681 24.8987 17.3094 24.8725 17.3484 24.8435L17.4597 24.7478L21.9998 20.2078L22.6463 20.8543C22.6738 20.8817 22.7028 20.9072 22.7322 20.9314C22.7028 20.9071 22.6738 20.8808 22.6463 20.8533L21.9998 20.2068L17.4597 24.7469ZM14.156 24.1678C14.1474 24.2113 14.1414 24.2549 14.1385 24.2976C14.1355 24.3404 14.135 24.383 14.1375 24.4246C14.1425 24.5086 14.1584 24.5903 14.1834 24.6678V24.6658C14.1342 24.5118 14.1212 24.3417 14.156 24.1668V24.1678ZM15.4597 22.7469L15.1375 24.3631L15.4597 22.7478L19.9988 18.2078L21.2918 19.4998H21.2928L19.9988 18.2068L15.4597 22.7469ZM24.3533 20.8533C24.3257 20.8809 24.2969 20.9071 24.2674 20.9314L24.3533 20.8543C24.3827 20.8248 24.4105 20.7941 24.4363 20.7625C24.4106 20.7938 24.3826 20.824 24.3533 20.8533ZM22.2928 18.5008L23.6463 19.8543C23.6562 19.8643 23.6652 19.8752 23.6726 19.8865L23.6463 19.8533L22.2928 18.4998V18.5008ZM25.3533 16.8533L23.7068 18.4998L25.3533 16.8543C25.3991 16.8085 25.4411 16.7598 25.4812 16.7107C25.4412 16.7596 25.3989 16.8077 25.3533 16.8533ZM18.5232 16.7097C18.5597 16.7602 18.6 16.809 18.6453 16.8543L19.2908 17.4998H19.2918L18.6453 16.8533C18.6002 16.8081 18.5596 16.7598 18.5232 16.7097ZM23.3533 14.8523L20.9998 17.2058L19.6463 15.8523C19.5654 15.772 19.4341 15.7719 19.3533 15.8523C19.3404 15.8653 19.3299 15.8801 19.3211 15.8953C19.3298 15.8803 19.3406 15.8661 19.3533 15.8533C19.4342 15.7725 19.5654 15.7727 19.6463 15.8533L20.9998 17.2068L23.3533 14.8533C23.3756 14.831 23.3987 14.8093 23.4226 14.7898L23.3533 14.8523ZM3.43924 2.93924C3.85511 2.52338 4.47546 2.3891 5.02616 2.59549L16.0262 6.72049C16.6409 6.95101 17.035 7.55433 16.9978 8.20975C16.9605 8.86518 16.5009 9.42047 15.864 9.57987L11.2371 10.7371L10.0799 15.364C9.92047 16.0009 9.36518 16.4605 8.70975 16.4978C8.05433 16.535 7.45101 16.1409 7.22049 15.5262L3.09549 4.52616C2.8891 3.97546 3.02338 3.35511 3.43924 2.93924ZM18.4959 15.3279C18.4915 15.3345 18.4875 15.3417 18.4832 15.3484C18.5076 15.3103 18.5341 15.2728 18.5633 15.2371L18.4959 15.3279ZM24.6453 14.8533C24.682 14.8901 24.7147 14.9296 24.7439 14.9705C24.7147 14.9294 24.6821 14.8892 24.6453 14.8523C24.637 14.844 24.6275 14.8367 24.6189 14.8289C24.6276 14.837 24.6368 14.8449 24.6453 14.8533ZM25.5974 14.4461C25.631 14.4969 25.662 14.5492 25.6902 14.6023C25.6326 14.4937 25.5642 14.389 25.4842 14.2908L25.5974 14.4461ZM24.1668 13.5935C24.157 13.5927 24.1473 13.5913 24.1375 13.5906L23.9998 13.5857C24.0555 13.5857 24.1112 13.5887 24.1668 13.5935Z\" fill=\"white\"/></g><path d=\"M22.6472 14.1463C23.3946 13.3992 24.6058 13.3992 25.3532 14.1463C26.1005 14.8938 26.1005 16.1059 25.3532 16.8533L23.7077 18.4988L24.3542 19.1453C24.8254 19.6168 24.8253 20.3809 24.3542 20.8524C23.8828 21.3237 23.1186 21.3236 22.6472 20.8524L22.0007 20.2069L17.4606 24.7459C17.3211 24.8853 17.1433 24.9806 16.9499 25.0194L15.3337 25.3426C14.6341 25.4823 14.0172 24.8654 14.1569 24.1658L14.4802 22.5506C14.5189 22.3572 14.6142 22.1784 14.7536 22.0389L19.2927 17.4988L18.6462 16.8524C18.1752 16.3809 18.1759 15.6157 18.6472 15.1444C19.1185 14.6737 19.8829 14.6736 20.3542 15.1444L21.0007 15.7908L22.6472 14.1463ZM15.4606 22.7459L15.1374 24.3621L16.7536 24.0389L21.2936 19.4998L19.9997 18.2059L15.4606 22.7459ZM4.14618 3.64631C4.28483 3.50767 4.49189 3.46321 4.67548 3.53205L15.6755 7.65705C15.8803 7.73388 16.011 7.93474 15.9987 8.15315C15.9863 8.37167 15.8331 8.55709 15.6208 8.61018L10.4118 9.91194L9.11005 15.1209C9.05696 15.3333 8.87154 15.4864 8.65302 15.4988C8.43465 15.5111 8.23375 15.3804 8.15692 15.1756L4.03192 4.17561C3.96308 3.99203 4.00756 3.78495 4.14618 3.64631Z\" fill=\"black\"/><defs><filter id=\"filter0_d_20089_234507\" x=\"0\" y=\"0.5\" width=\"29.9133\" height=\"29.8647\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\"><feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/><feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/><feOffset dy=\"1\"/><feGaussianBlur stdDeviation=\"1.5\"/><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0\"/><feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_20089_234507\"/><feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_20089_234507\" result=\"shape\"/></filter></defs></svg>") 3 3, crosshair;--fig-lab-cursor-move:url("data:image/svg+xml,<svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g clip-path=\"url(%23clip0_20065_165164)\"><g filter=\"url(%23filter0_d_20065_165164)\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2.93938 2.93938C3.35531 2.52345 3.97597 2.38901 4.52673 2.59555L15.5267 6.72055C16.1416 6.95111 16.535 7.55477 16.4976 8.21034C16.4603 8.86592 16.0009 9.421 15.3638 9.58026L10.737 10.737L9.58026 15.3638C9.421 16.0009 8.86592 16.4603 8.21034 16.4976C7.55477 16.535 6.95111 16.1416 6.72055 15.5267L2.59555 4.52673C2.38901 3.97597 2.52345 3.35531 2.93938 2.93938Z\" fill=\"white\"/><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M18.4394 12.9394C19.0252 12.3536 19.9749 12.3536 20.5607 12.9394L26.0607 18.4394C26.6465 19.0252 26.6465 19.9749 26.0607 20.5607L20.5607 26.0607C19.9749 26.6465 19.0252 26.6465 18.4394 26.0607L12.9394 20.5607C12.3536 19.9749 12.3536 19.0252 12.9394 18.4394L18.4394 12.9394Z\" fill=\"white\"/></g><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4.17558 3.53185C3.99199 3.463 3.7851 3.50782 3.64646 3.64646C3.50782 3.7851 3.463 3.99199 3.53185 4.17558L7.65685 15.1756C7.7337 15.3805 7.93492 15.5117 8.15345 15.4992C8.37197 15.4868 8.557 15.3336 8.61009 15.1213L9.91232 9.91232L15.1213 8.61009C15.3336 8.557 15.4868 8.37197 15.4992 8.15345C15.5117 7.93492 15.3805 7.7337 15.1756 7.65685L4.17558 3.53185Z\" fill=\"black\"/><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M19.1464 13.6464C19.3417 13.4512 19.6583 13.4512 19.8536 13.6464L21.8536 15.6464C22.0488 15.8417 22.0488 16.1583 21.8536 16.3536C21.6583 16.5488 21.3417 16.5488 21.1464 16.3536L20 15.2071V19H23.7929L22.6464 17.8536C22.4512 17.6583 22.4512 17.3417 22.6464 17.1464C22.8417 16.9512 23.1583 16.9512 23.3536 17.1464L25.3536 19.1464C25.5488 19.3417 25.5488 19.6583 25.3536 19.8536L23.3536 21.8536C23.1583 22.0488 22.8417 22.0488 22.6464 21.8536C22.4512 21.6583 22.4512 21.3417 22.6464 21.1464L23.7929 20H20V23.7929L21.1464 22.6464C21.3417 22.4512 21.6583 22.4512 21.8536 22.6464C22.0488 22.8417 22.0488 23.1583 21.8536 23.3536L19.8536 25.3536C19.6583 25.5488 19.3417 25.5488 19.1464 25.3536L17.1464 23.3536C16.9512 23.1583 16.9512 22.8417 17.1464 22.6464C17.3417 22.4512 17.6583 22.4512 17.8536 22.6464L19 23.7929V20H15.2071L16.3536 21.1464C16.5488 21.3417 16.5488 21.6583 16.3536 21.8536C16.1583 22.0488 15.8417 22.0488 15.6464 21.8536L13.6464 19.8536C13.4512 19.6583 13.4512 19.3417 13.6464 19.1464L15.6464 17.1464C15.8417 16.9512 16.1583 16.9512 16.3536 17.1464C16.5488 17.3417 16.5488 17.6583 16.3536 17.8536L15.2071 19H19V15.2071L17.8536 16.3536C17.6583 16.5488 17.3417 16.5488 17.1464 16.3536C16.9512 16.1583 16.9512 15.8417 17.1464 15.6464L19.1464 13.6464Z\" fill=\"black\"/></g><defs><filter id=\"filter0_d_20065_165164\" x=\"-0.5\" y=\"0.5\" width=\"30\" height=\"30\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\"><feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/><feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/><feOffset dy=\"1\"/><feGaussianBlur stdDeviation=\"1.5\"/><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0\"/><feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_20065_165164\"/><feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_20065_165164\" result=\"shape\"/></filter><clipPath id=\"clip0_20065_165164\"><rect width=\"32\" height=\"32\" fill=\"white\"/></clipPath></defs></svg>") 3 3, move}body.fig-lab-move-active,body.fig-lab-move-active *{cursor:var(--fig-lab-cursor-move)!important}body.fig-lab-rotate-active,body.fig-lab-rotate-active *{cursor:var(--fig-lab-cursor-rotate)!important}fig-canvas-control{--fig-canvas-control-line-stroke:light-dark(#fff,#ffffff80);--fig-canvas-control-radius-stroke:#0d99ff;--fig-canvas-control-radius-stroke-halo:#fff0;--fig-canvas-control-stroke-halo:var(--fig-canvas-control-radius-stroke-halo);--fig-canvas-control-stroke-halo-hover:#fff;--fig-canvas-control-line-stroke-hover:#0d99ff;--fig-canvas-control-line-stroke-active:#0d99ff;--fig-canvas-control-line-stroke-width:1px;--fig-canvas-control-line-stroke-width-hover:2px;display:contents;&:has(.fig-canvas-control-radius-hit:hover,.fig-canvas-control-angle-line-hit:hover){--fig-canvas-control-line-stroke-width:var(--fig-canvas-control-line-stroke-width-hover);--fig-canvas-control-stroke-halo:var(--fig-canvas-control-stroke-halo-hover)}&>fig-handle,&>fig-tooltip:has(fig-handle:not([size=small])){z-index:1}& fig-handle{&[type=color]{--width:.75rem;--height:.75rem;--fig-handle-padding:1px;--fig-handle-shadow:none;&:hover,&:focus-within,&[selected]:not([selected=false]){--width:1rem;--height:1rem;--fig-handle-outline-color:transparent}&.dragging,&:active{--fig-handle-padding:2px!important}&[selected]:not([selected=false]){--fig-handle-padding:2px}}}& fig-handle:hover,& fig-handle:hover .fig-handle-hit-area:not([data-cursor]){cursor:var(--fig-lab-cursor)!important}&[type=color] fig-handle[type=color]:hover:not(:active,.active,.dragging),&[type=color] fig-handle[type=color]:hover:not(:active,.active,.dragging) .fig-handle-hit-area{cursor:var(--fig-lab-cursor-eyedropper)!important}& fig-handle:is(:active,.active,.dragging),& fig-handle:is(:active,.active,.dragging) .fig-handle-hit-area:not([data-cursor]){cursor:var(--fig-lab-cursor-move)!important}& .fig-canvas-control-angle-line-hit{cursor:var(--fig-lab-cursor-move)}& .fig-canvas-control-radius{pointer-events:none;position:absolute;overflow:visible;& circle{fill:none;stroke:var(--fig-canvas-control-radius-stroke);stroke-width:var(--fig-canvas-control-line-stroke-width);paint-order:stroke fill}& .fig-canvas-control-radius-halo{stroke:var(--fig-canvas-control-stroke-halo);stroke-width:calc(var(--fig-canvas-control-line-stroke-width) + 2px);filter:none}& .fig-canvas-control-radius-hit{stroke:#0000;stroke-width:12px;pointer-events:stroke;filter:none}}&.fig-canvas-control-ring-active{--fig-canvas-control-line-stroke-width:var(--fig-canvas-control-line-stroke-width-hover)}& .fig-canvas-control-angle-svg{pointer-events:none}& .fig-canvas-control-angle-line{stroke:var(--fig-canvas-control-radius-stroke);stroke-width:var(--fig-canvas-control-line-stroke-width);paint-order:stroke fill;filter:drop-shadow(0 0 .5px #0000004d)drop-shadow(0 .5px 1px #0000001f)}& .fig-canvas-control-angle-line-halo{stroke:var(--fig-canvas-control-stroke-halo);stroke-width:calc(var(--fig-canvas-control-line-stroke-width) + 2px);stroke-linecap:butt;filter:none}& fig-handle[size=small]{z-index:2;& .fig-handle-hit-area{cursor:grab}}}fig-input-angle{--size:1.5rem;align-items:center;gap:var(--spacer-2);user-select:none;display:inline-flex;&>fig-input-number{flex:none;width:auto}&[full]:not([full=false]){width:100%;display:flex;&>fig-input-number{flex:auto;width:auto;min-width:0}}fig-field:not([direction=vertical]) &{flex:1;min-width:0;& fig-input-number{flex:none;width:auto}}& .fig-input-angle-plane{width:var(--size);height:var(--size);aspect-ratio:1;background-color:var(--figma-color-bg-secondary);box-shadow:inset 0 0 0 1px var(--figma-color-border);border-radius:100%;flex-shrink:0;place-items:center;display:inline-grid;&:focus{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&.dragging{box-shadow:inset 0 0 0 1px var(--figma-color-border-selected);outline:0}}& .fig-input-angle-handle{grid-area:1/1;place-items:center;width:calc(.5rem + 2px);height:calc(.5rem + 2px);display:inline-grid;&:before{content:"";background:var(--handle-color);width:.5rem;height:.5rem;box-shadow:var(--handle-shadow);border-radius:50%;display:block}}}propskit-oscillator{--aspect-ratio:2 / 1;--oscillator-stroke-width:2;--propskit-oscillator-playhead-radius:5px;flex-direction:column;width:100%;display:flex;& .propskit-oscillator-svg-container{border-radius:var(--radius-medium-large);padding:var(--spacer-3) var(--spacer-5);margin-bottom:var(--spacer-2);position:relative;overflow:hidden;&:before{inset:0 var(--spacer-3);content:"";background:var(--figma-color-bg-secondary);border-radius:var(--radius-medium-large);position:absolute}&:is(:hover,:active,:focus,:focus-visible,:focus-within){overflow:visible}& path{stroke:var(--figma-color-border-strong)}}& .propskit-oscillator-svg{width:100%;aspect-ratio:var(--aspect-ratio);z-index:1;display:block;position:relative;overflow:visible;& .propskit-oscillator-handle{opacity:0}&:hover,&:focus-within,&.dragging{& .propskit-oscillator-handle{opacity:1}}}& .propskit-oscillator-bounds{fill:#0000}& .propskit-oscillator-baseline{pointer-events:none;stroke:var(--figma-color-bordertranslucent);stroke-width:var(--oscillator-stroke-width);stroke-linecap:round}& .propskit-oscillator-path{pointer-events:none;fill:none;stroke:var(--figma-color-text);stroke-width:var(--oscillator-stroke-width);stroke-linejoin:round;stroke-linecap:round}& .propskit-oscillator-playhead{pointer-events:none;r:var(--propskit-oscillator-playhead-radius);fill:var(--handle-color);stroke:var(--figma-color-bg);stroke-width:1px}& .propskit-oscillator-handle{pointer-events:all;cursor:default;overflow:visible;& .propskit-oscillator-handle-inner{place-items:center;width:100%;height:100%;display:grid;overflow:visible}}& .propskit-oscillator-frequency-handle{cursor:ew-resize;& fig-handle,& fig-handle:hover,& fig-handle .fig-handle-hit-area,& fig-handle:hover .fig-handle-hit-area,& fig-handle:is(:active,.active,.dragging),& fig-handle:is(:active,.active,.dragging) .fig-handle-hit-area{cursor:ew-resize!important}}& .propskit-oscillator-amplitude-handle{cursor:ns-resize;& fig-handle,& fig-handle:hover,& fig-handle .fig-handle-hit-area,& fig-handle:hover .fig-handle-hit-area,& fig-handle:is(:active,.active,.dragging),& fig-handle:is(:active,.active,.dragging) .fig-handle-hit-area{cursor:ns-resize!important}}& .propskit-oscillator-waves{flex-direction:column;gap:0;display:flex}& .propskit-oscillator-wave{margin-bottom:0;&>fig-header{& .propskit-oscillator-remove-button,& .propskit-oscillator-add-type-button{flex-shrink:0}}}& .propskit-oscillator-field{width:100%}& .propskit-oscillator-add-type-button{width:var(--spacer-4);height:var(--spacer-4);min-width:var(--spacer-4)}&[disabled]:not([disabled=false]){pointer-events:none;opacity:.6}}fig-reorder{display:contents}fig-reorder:not([handle]):is(:not([disabled]),[disabled=false])>[data-reorder-item],fig-reorder:not([handle]):is(:not([disabled]),[disabled=false])>[data-reorder-item]>fig-header,fig-reorder:not([handle]):is(:not([disabled]),[disabled=false])>[data-reorder-item]>fig-header *,fig-reorder:not([handle]):is(:not([disabled]),[disabled=false])>[data-reorder-item]>label{cursor:grab}fig-reorder>.dragging{background-color:var(--figma-color-bg-selected)}[data-reorder-handle]{cursor:grab}fig-reorder[disabled]:not([disabled=false]) [data-reorder-handle]{cursor:inherit}body.fig-reorder-dragging,body.fig-reorder-dragging *{-webkit-user-select:none!important;user-select:none!important;cursor:grabbing!important}.fig-reorder-indicator{pointer-events:none;z-index:1000000;background:var(--figma-color-border-strong);position:fixed}.fig-reorder-indicator[data-axis=vertical]{height:2px}.fig-reorder-indicator[data-axis=horizontal]{width:2px}
|
|
1
|
+
fig-ai-prompt{--fig-ai-prompt-margin-inline:var(--spacer-3);box-sizing:border-box;width:calc(100% - var(--fig-ai-prompt-margin-inline) - var(--fig-ai-prompt-margin-inline));min-height:8rem;margin-inline:var(--fig-ai-prompt-margin-inline);border:1px solid var(--figma-color-border);border-radius:var(--radius-large);background:var(--figma-color-bg);color:var(--figma-color-text);flex-direction:column;display:flex;&:has(>fig-input-text:focus-within){outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&>fig-input-text{width:100%;min-width:0;box-shadow:none;font-size:var(--body-large-fontSize);background:0 0;border-radius:0;flex:auto;&:hover,&:has(textarea:focus){box-shadow:none;outline:0}&[disabled]:not([disabled=false]){box-shadow:none;background:0 0}&>textarea{box-sizing:border-box;width:100%;height:auto;min-height:var(--spacer-6);padding:var(--spacer-3);resize:none;font-size:inherit;align-self:stretch;padding-bottom:0}}&>fig-attachments{box-sizing:border-box;width:auto;margin:var(--spacer-2) var(--spacer-3) 0}&>fig-footer{box-shadow:none;border:none;justify-content:space-between}}fig-ai-context{--fig-ai-context-margin-inline:var(--spacer-3);gap:var(--spacer-2);box-sizing:border-box;width:calc(100% - var(--fig-ai-context-margin-inline) - var(--fig-ai-context-margin-inline));margin-inline:var(--fig-ai-context-margin-inline);padding:var(--spacer-2) var(--spacer-2-5);padding-bottom:var(--spacer-4);border:1px solid var(--figma-color-border);border-radius:var(--radius-large) var(--radius-large) 0 0;color:var(--figma-color-text);border-bottom:none;flex-direction:column;display:flex;&>fig-attachments{margin-inline:calc(-1 * var(--spacer-1))}}fig-ai-context:has(+fig-ai-prompt){margin-bottom:calc(-1 * var(--spacer-3))}fig-attachments{align-items:flex-start;gap:var(--spacer-2);flex-wrap:wrap;width:100%;min-width:0;display:flex}fig-attachment{--fig-attachment-size:2.5rem;flex:0 0 var(--fig-attachment-size);width:var(--fig-attachment-size);height:var(--fig-attachment-size);min-width:0;display:block;position:relative;& fig-image{width:100%;display:flex}& .fig-attachment-fallback{border-radius:var(--radius-medium);background:var(--figma-color-bg-secondary);box-shadow:inset 0 0 0 1px var(--figma-color-bordertranslucent);color:var(--figma-color-text-secondary);font-size:var(--body-medium-fontSize);pointer-events:none;place-items:center;font-weight:500;line-height:1;display:none;position:absolute;inset:0}&[data-fallback]{& .fig-attachment-fallback{display:grid}}& .fig-attachment-remove{--spacer-2:0px;--spacer-4:1.25rem;z-index:3;top:var(--spacer-1);right:var(--spacer-1);opacity:0;pointer-events:none;width:1.25rem;min-width:1.25rem;height:1.25rem;padding:0;position:absolute}&:hover .fig-attachment-remove,&:focus-within .fig-attachment-remove{opacity:1;pointer-events:auto}&[disabled]:not([disabled=false]){opacity:.5;& .fig-attachment-remove{pointer-events:none}}}fig-chat-message{gap:var(--spacer-2-5);box-sizing:border-box;width:100%;max-width:100%;color:var(--figma-color-text);font-size:var(--body-large-fontSize);overflow-wrap:anywhere;white-space:pre-wrap;flex-direction:column;display:flex;&[from=user]{width:auto;padding:var(--spacer-2-5);border-radius:var(--radius-large);background:var(--figma-color-bg-secondary);margin-inline-start:var(--spacer-4)}&[from=user]:has(>fig-avatar){margin-inline-end:calc(var(--spacer-4) + var(--spacer-2));position:relative;&>fig-avatar{right:calc(-1 * (var(--spacer-4) + var(--spacer-2)));position:absolute;bottom:0}}&+fig-chat-message{margin-top:var(--spacer-3)}}:is(propskit-switch,propskit-color,propskit-fill,propskit-gradient,propskit-palette,propskit-select,propskit-easing,propskit-text,propskit-number,propskit-origin,propskit-position,propskit-joystick,propskit-spring,propskit-color-point,propskit-point-radius,propskit-point-radius-angle,propskit-point-point,propskit-group,propskit-slider,propskit-wheel,propskit-oscillator){--figma-focus-outline-radius:var(--radius-medium-large);user-select:none;& :is(input:not([type]),input[type=text],input[type=number],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url],textarea,[contenteditable=true]){user-select:text}}propskit-group{width:100%;margin-bottom:var(--spacer-2-5);display:block;& p{margin:0 var(--spacer-3) var(--spacer-2) var(--spacer-3)}&+propskit-group{box-shadow:inset 0 1px 0 0 var(--figma-color-border);&:not([name]){padding-top:var(--spacer-2-5)}}&[borderless]:not([borderless=false])+propskit-group{box-shadow:none;&:not([name]){padding-top:0}}&[compact]:not([compact=false])>fig-header{--fig-header-height:var(--spacer-5);height:var(--fig-header-height)}&>fig-header{cursor:default;gap:0;&:focus-visible{--figma-focus-outline-radius:var(--radius-medium);outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset);border-radius:var(--figma-focus-outline-radius)}&>h3{text-overflow:ellipsis;white-space:nowrap;user-select:none;flex:auto;min-width:0;max-width:100%;margin:0;padding-left:0;display:block;overflow:hidden}&>.propskit-group-chevron{--icon:var(--icon-16-chevron);--size:1rem;color:var(--figma-color-text-tertiary);transition:transform var(--transition-duration) var(--transition-timing-function);margin-left:calc(var(--spacer-2) * -1);flex:none;transform:rotate(-90deg)}}&:not([open]):not([open=true]),&[open=false]{margin-bottom:0;&>fig-header{color:var(--figma-color-text-secondary);&:hover{color:var(--figma-color-text);& .propskit-group-chevron{color:inherit}}}&>:not(fig-header){display:none}}&[open]:not([open=false])>fig-header .propskit-group-chevron{transform:rotate(0)}&>fig-header>.propskit-group-reset-tooltip{opacity:0;visibility:hidden;pointer-events:none;color:var(--figma-color-icon-tertiary);transition:opacity var(--transition-duration) var(--transition-timing-function), visibility var(--transition-duration) var(--transition-timing-function), color var(--transition-duration) var(--transition-timing-function);flex-shrink:0;& fig-icon{color:var(--figma-color-icon-tertiary)}&:hover,&:focus-within{& fig-icon{color:var(--figma-color-icon-primary,var(--figma-color-icon))}}}&[data-dirty]:not([data-dirty=false]):not([show-reset=false])>fig-header>.propskit-group-reset-tooltip:not([hidden]){opacity:1;visibility:visible;pointer-events:auto}&[show-reset=false]>fig-header>.propskit-group-reset-tooltip{display:none}}main:has(>propskit-group[name]:first-child),fig-content:has(>propskit-group[name]:first-child){padding-top:0}main:has(>propskit-group[name]:last-child),fig-content:has(>propskit-group[name]:last-child){padding-bottom:0}:is(propskit-switch,propskit-color,propskit-fill,propskit-gradient,propskit-select,propskit-easing,propskit-text,propskit-number,propskit-origin,propskit-position,propskit-joystick,propskit-spring,propskit-color-point,propskit-point-radius,propskit-point-radius-angle,propskit-point-point,propskit-group,propskit-slider,propskit-wheel,propskit-oscillator) :is(fig-input-text,fig-input-number)[disabled]:not([disabled=false]){box-shadow:none;background:0 0;border:0}propskit-switch{--propskit-switch-height:2rem;--_propskit-padding-block:var(--propskit-switch-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-switch-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-switch-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-switch-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-switch-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-switch-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-switch-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-switch-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-switch-label-inline-size,var(--propskit-label-inline-size,75%));--_propskit-input-inline-size:var(--propskit-switch-input-inline-size,var(--propskit-input-inline-size,var(--_propskit-switch-control-inline-size,2rem)));box-sizing:border-box;width:100%;height:calc(var(--propskit-switch-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&[variant=segmented-control]{--_propskit-switch-control-inline-size:4.5rem}&:not([variant=segmented-control]) .propskit-switch-surface{padding-inline-end:var(--spacer-2)}&[disabled]:not([disabled=false]){pointer-events:none;& label{color:var(--figma-color-text-disabled)}}& .propskit-switch-surface{height:100%;padding-inline:var(--spacer-2-5) var(--spacer-1);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);cursor:default;align-items:center;display:flex;position:relative;&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;min-width:0;max-inline-size:var(--_propskit-label-inline-size);color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:auto;align-items:center;margin:0;display:flex;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& :is(fig-switch,fig-segmented-control){inline-size:var(--_propskit-input-inline-size);min-inline-size:var(--_propskit-input-inline-size);flex:none;margin-inline-start:auto}& fig-switch{justify-content:flex-end;padding-block:0}}}propskit-color{--_propskit-padding-block:var(--propskit-color-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-color-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-color-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-color-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-color-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-color-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-color-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-color-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-color-label-inline-size,var(--propskit-label-inline-size,40%));--_propskit-input-inline-size:var(--propskit-color-input-inline-size,var(--propskit-input-inline-size,33%))}propskit-fill{--_propskit-padding-block:var(--propskit-fill-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-fill-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-fill-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-fill-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-fill-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-fill-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-fill-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-fill-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-fill-label-inline-size,var(--propskit-label-inline-size,40%));--_propskit-input-inline-size:var(--propskit-fill-input-inline-size,var(--propskit-input-inline-size,33%))}propskit-color,propskit-fill{--propskit-color-height:2rem;--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-color-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&[disabled]:not([disabled=false]){pointer-events:none;& label{color:var(--figma-color-text-disabled)}}& :is(.propskit-color-surface,.propskit-fill-surface){align-items:center;gap:var(--spacer-2);height:100%;border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);padding-inline-start:var(--spacer-2-5);display:flex;position:relative;&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;max-inline-size:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:0 auto;align-items:center;margin:0;padding:0;display:flex;position:relative;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-fill-picker{display:contents}& fig-swatch{flex:0 0 var(--_propskit-input-inline-size);inline-size:var(--_propskit-input-inline-size);contain:paint;--width:100%;--height:var(--propskit-color-height);--size:var(--propskit-color-height);--border-radius:var(--radius-medium);min-width:0;height:var(--propskit-color-height);border-radius:var(--radius-medium);margin-inline-start:auto;position:relative;overflow:hidden}}}propskit-gradient{--propskit-gradient-height:2rem;--_propskit-padding-block:var(--propskit-gradient-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-gradient-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-gradient-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-gradient-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-gradient-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-gradient-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-gradient-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-gradient-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-gradient-label-inline-size,var(--propskit-label-inline-size,40%));--_propskit-input-inline-size:var(--propskit-gradient-input-inline-size,var(--propskit-input-inline-size,33%));--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-gradient-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;& fig-input-gradient{--fig-input-gradient-height:var(--propskit-gradient-height);--fig-input-gradient-swatch-border-radius:var(--radius-medium);height:var(--propskit-gradient-height);& fig-swatch{--height:var(--propskit-gradient-height);--size:var(--propskit-gradient-height);height:var(--propskit-gradient-height)}}&[disabled]:not([disabled=false]){pointer-events:none;& label{color:var(--figma-color-text-disabled)}}& .propskit-gradient-surface{align-items:center;gap:var(--spacer-2);height:100%;border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);padding-inline-start:var(--spacer-2-5);display:flex;position:relative;&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;max-inline-size:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:0 auto;align-items:center;margin:0;padding:0;display:flex;position:relative;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-input-gradient{flex:0 0 var(--_propskit-input-inline-size);inline-size:var(--_propskit-input-inline-size);border-radius:var(--radius-medium);background-color:#0000;min-width:0;margin-inline-start:auto;position:relative}}}:is(propskit-color,propskit-fill,propskit-gradient){outline:none;& fig-swatch{--border-radius:var(--radius-medium);--fig-swatch-border-radius:var(--radius-medium);border-radius:var(--radius-medium);background-color:#0000!important}& :is(.propskit-color-surface,.propskit-fill-surface,.propskit-gradient-surface){outline:none}&:focus-within :is(.propskit-color-surface,.propskit-fill-surface,.propskit-gradient-surface),&.has-popup-open :is(.propskit-color-surface,.propskit-fill-surface,.propskit-gradient-surface){outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}& :is(fig-swatch,fig-chit,fig-input-gradient,fig-input-fill,fig-fill-picker){--selected:0!important;&:hover,&:focus,&:active,&:focus-within:not(:focus){outline:0!important}&:focus-within:not(:focus) :is(input,fig-swatch,fig-chit){outline-offset:0!important;outline:0!important}}& input[type=color]:is(:focus,:focus-visible){outline-offset:0!important;outline:0!important}}propskit-palette{--propskit-palette-height:2rem;--_propskit-padding-block:var(--propskit-palette-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-palette-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-palette-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-palette-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-palette-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-palette-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-palette-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-palette-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-palette-label-inline-size,var(--propskit-label-inline-size,40%));--_propskit-input-inline-size:var(--propskit-palette-input-inline-size,var(--propskit-input-inline-size,60%));--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-palette-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&[disabled]:not([disabled=false]){pointer-events:none;& label{color:var(--figma-color-text-disabled)}}& .propskit-palette-surface{align-items:center;gap:var(--spacer-2);box-sizing:border-box;height:100%;border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);cursor:default;padding-inline-start:var(--spacer-2-5);display:flex;position:relative;&:after{content:"";border:var(--_propskit-border);border-radius:inherit;pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&:focus-within{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&>label{z-index:1;max-inline-size:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:0 auto;align-items:center;margin:0;padding:0;display:flex;position:relative;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}&>fig-select{--fig-select-trigger-width:100%;z-index:1;border-radius:inherit;width:100%;min-width:0;max-width:none;height:100%;box-shadow:none;background:0 0;margin:0;display:flex;position:absolute;inset:0;&::part(trigger){gap:var(--spacer-1);min-width:0;padding-left:calc(var(--_propskit-label-inline-size) + var(--spacer-2));background:0 0}&::part(prepend){flex:auto;min-width:0;margin:0;display:flex}}}& .propskit-palette-preview{--fig-input-palette-height:calc(var(--propskit-palette-height) - var(--spacer-2));--fig-input-palette-padding:0px;border-radius:var(--radius-medium);opacity:1;pointer-events:none;width:100%;min-width:0;&[hidden]{display:none!important}&>.palette-colors-inline{border-radius:var(--radius-medium);background:0 0;padding:0;&>.palette-colors{border-radius:var(--radius-medium)}}}& .propskit-palette-options{& fig-select-option{min-height:var(--propskit-palette-height);cursor:default;&>.propskit-palette-option-preview{flex:auto;min-width:0;margin-block:0;margin-inline-end:0;display:flex}& .propskit-palette-preview{--fig-input-palette-height:var(--spacer-4);--fig-input-palette-padding:0px}}}}propskit-select{--propskit-select-height:2rem;--_propskit-padding-block:var(--propskit-select-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-select-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-select-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-select-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-select-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-select-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-select-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-select-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-select-label-inline-size,var(--propskit-label-inline-size,75%));--_propskit-input-inline-size:var(--propskit-select-input-inline-size,var(--propskit-input-inline-size,100%));--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-select-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;& .propskit-select-surface{& fig-select{padding-right:var(--spacer-1);&:after{right:calc(.25rem + var(--spacer-1))}}& fig-select::part(trigger){padding-left:var(--spacer-2-5)}}&[disabled]:not([disabled=false]){pointer-events:none;& label{color:var(--figma-color-text-disabled)}}& .propskit-select-surface{border-radius:var(--radius-medium-large);background:var(--_propskit-background);height:100%;color:var(--_propskit-color);align-items:center;padding:0;display:flex;position:relative;&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-select{inline-size:var(--_propskit-input-inline-size);border-radius:inherit;min-width:0;height:100%;box-shadow:none;background:0 0;flex:auto;align-self:stretch;align-items:stretch;display:flex;position:relative}& fig-select{--fig-select-trigger-width:100%;&::part(label){text-align:right}}}}propskit-text{--propskit-text-height:2rem;--_propskit-padding-block:var(--propskit-text-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-text-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-text-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-text-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-text-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-text-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-text-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-text-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-text-label-inline-size,var(--propskit-label-inline-size,50%));--_propskit-input-inline-size:var(--propskit-text-input-inline-size,var(--propskit-input-inline-size,fit-content));--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;min-height:calc(var(--propskit-text-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&[disabled]:not([disabled=false]){pointer-events:none;& label,& :is(input,textarea){color:var(--figma-color-text-disabled)}}& .propskit-text-surface{align-items:center;gap:var(--spacer-2);box-sizing:border-box;min-height:var(--propskit-text-height);padding-block:var(--spacer-1);padding-inline:var(--spacer-2-5) var(--spacer-1);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);outline:none;display:flex;position:relative;&:focus-within{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;min-width:0;margin:var(--spacer-1) 0 0;max-inline-size:var(--_propskit-label-inline-size);color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:none;align-self:flex-start;align-items:center;padding:0;display:flex;position:relative;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-input-text{--figma-focus-outline-offset:1px;min-width:0;max-width:none;min-height:var(--control-height);border-radius:var(--radius-medium);box-shadow:none;background-color:#0000;align-self:center;margin-inline-start:auto;position:relative;width:var(--_propskit-input-inline-size)!important;outline:none!important;flex:0 auto!important;&:has(:is(input,textarea):focus){outline:none!important}& :is(input,textarea){text-align:right;flex:none;width:auto;min-width:0;max-width:100%}& input:not(:focus){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}& textarea{min-height:1lh;max-height:calc(4lh + var(--spacer-2));white-space:pre-wrap;overflow-y:auto}}}}propskit-number{--propskit-number-height:2rem;--_propskit-padding-block:var(--propskit-number-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-number-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-number-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-number-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-number-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-number-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-number-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-number-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-number-label-inline-size,var(--propskit-label-inline-size,75%));--_propskit-input-inline-size:var(--propskit-number-input-inline-size,var(--propskit-input-inline-size,fit-content));--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-number-height) + var(--_propskit-padding-block) * 2);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&[disabled]:not([disabled=false]){pointer-events:none;& label,& input{color:var(--figma-color-text-disabled)}}&[steppers]:not([steppers=false]) fig-input-number input{padding-right:0}& .propskit-number-surface{align-items:center;gap:var(--spacer-2);box-sizing:border-box;height:100%;padding-inline:var(--spacer-2-5) var(--spacer-1);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);outline:none;display:flex;position:relative;&:focus-within{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;min-width:0;max-inline-size:var(--_propskit-label-inline-size);color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:none;align-items:center;padding:0;display:flex;position:relative;overflow:hidden;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-input-number{--figma-focus-outline-offset:1px;min-width:0;max-width:none;height:var(--control-height);border-radius:var(--radius-medium);box-shadow:none;background-color:#0000;align-self:center;margin-inline-start:auto;position:relative;width:var(--_propskit-input-inline-size)!important;outline:none!important;flex:0 auto!important;&:has(input:focus){outline:none!important}& input{field-sizing:content;text-align:right;font-variant-numeric:tabular-nums;flex:none;width:auto;min-width:0;max-width:100%}}}}propskit-slider{--propskit-slider-elastic-distance:calc(var(--spacer-2) + .25rem);--propskit-slider-elastic-size:0px;--propskit-slider-elastic-scale:1;--propskit-slider-elastic-origin:left center;--propskit-slider-elastic-transition:.18s cubic-bezier(.2, 1.45, .35, 1);--propskit-slider-height:2rem;--_propskit-padding-block:var(--propskit-slider-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-slider-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-slider-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-slider-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-slider-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-slider-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-slider-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-slider-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-slider-label-inline-size,var(--propskit-label-inline-size,75%));--_propskit-input-inline-size:var(--propskit-slider-input-inline-size,var(--propskit-input-inline-size,100%));--figma-focus-outline-offset:1px;--propskit-slider-progress-shadow:inset 0px .75px 0px 0px light-dark(#0000,#ffffff1a);--field-text-shadow:0 1px 1.5px light-dark(#0003,#0003);--propskit-slider-fig-slider-height:var(--propskit-slider-height);--propskit-slider-fig-slider-thumb-height:calc(var(--propskit-slider-fig-slider-height) - var(--spacer-3));--propskit-slider-number-right:calc(2px + var(--spacer-1));--propskit-slider-handle-fade-start-threshold:var(--spacer-3);--propskit-slider-handle-fade-end-threshold:var(--spacer-2);--propskit-slider-handle-proximity:1;--propskit-slider-handle-reveal:0;--propskit-slider-handle-scale:var(--propskit-slider-handle-proximity);--propskit-slider-handle-color:light-dark(#222,var(--figma-color-text));box-sizing:border-box;width:100%;height:calc(var(--propskit-slider-height) + var(--_propskit-padding-block) * 2);border-radius:var(--radius-medium-large);transform-origin:var(--propskit-slider-elastic-origin);transition:transform var(--propskit-slider-elastic-transition);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;position:relative;&:hover,&:focus-within{--propskit-slider-handle-reveal:1}& label{pointer-events:none;z-index:1}&[disabled]:not([disabled=false]){pointer-events:none;& label,& input{color:var(--figma-color-text-disabled)}& fig-slider{filter:grayscale()opacity(.5)}}&[type=hue]{& label,& input{color:var(--propskit-slider-filled-text-color,var(--figma-color-text-oninverse))!important}}&[type=opacity] fig-slider{--slider-checkerboard:var(--checkerboard)}& .propskit-slider-surface{border-radius:var(--figma-focus-outline-radius);background:var(--_propskit-background);height:100%;color:var(--_propskit-color);outline:none;padding-inline-start:var(--spacer-2-5);display:flex;position:relative;&:focus-within{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&>label{min-width:0;max-width:var(--_propskit-label-inline-size);width:var(--_propskit-label-inline-size);color:inherit;align-items:center;gap:var(--spacer-1);flex:auto;height:100%;margin:0;display:flex;& fig-icon:first-child{margin-left:calc(var(--spacer-1) * -1)}}& fig-slider{inline-size:var(--_propskit-input-inline-size);border-radius:inherit;--slider-height:var(--propskit-slider-fig-slider-height);background-color:#0000;outline:none;padding:0;position:absolute;inset-block:0;inset-inline-end:0;&:focus-within,&:has(input[type=range]:focus-visible){outline:none}--slider-field-height:var(--propskit-slider-height);--slider-thumb-width:var(--spacer-1);--slider-thumb-color:var(--propskit-slider-handle-color);--slider-thumb-height:var(--propskit-slider-fig-slider-thumb-height);--slider-border-radius:var(--radius-medium-large);--slider-tick-width:.125rem;--slider-tick-height:var(--spacer-2);--slider-tick-radius:var(--radius-medium);--slider-stepper-padding:0;--propskit-slider-thumb-inset:var(--spacer-2);--propskit-slider-progress-percent:var(--slider-percent);--propskit-slider-thumb-travel-offset:calc((var(--slider-complete) - 1) * var(--slider-thumb-width) - var(--propskit-slider-thumb-inset));--slider-thumb-opacity:calc(var(--propskit-slider-handle-proximity) * var(--propskit-slider-handle-proximity) * var(--propskit-slider-handle-reveal));--slider-tick-opacity:.5;--slider-handle-shadow:inset 0 0 0 var(--slider-thumb-height) var(--slider-thumb-color)!important;&[type=delta],&[type=stepper],&[type=hue]{--propskit-slider-thumb-inset:0}&[type=stepper]{& datalist{opacity:0}&:hover,&:focus-within{& datalist{opacity:1}}}&[type=stepper] .fig-slider-input-container input[type=range]{margin-left:0;width:100%!important}& .fig-slider-input-container{overflow:hidden;box-shadow:none!important;background-color:var(--_propskit-background)!important;&:after{border:var(--_propskit-border)}&:hover,&:focus-within{color:var(--_propskit-hover-color);background-color:var(--_propskit-hover-background)!important;&:after{content:"";pointer-events:none;border-radius:var(--slider-border-radius);border:var(--_propskit-hover-border);position:absolute;inset:0;box-shadow:none!important}}&:before{box-shadow:var(--propskit-slider-progress-shadow)!important;background:var(--figma-color-bordertranslucent)!important;min-width:0!important;box-shadow:none!important}& input[type=range]{margin-left:0;border-radius:0!important;width:100%!important;&::-webkit-slider-thumb{margin-left:var(--propskit-slider-thumb-travel-offset)}&::-moz-range-thumb{margin-left:var(--propskit-slider-thumb-travel-offset)}}}&:not([type=delta]) .fig-slider-input-container:before{max-width:100%;width:var(--propskit-slider-progress-percent)!important}&[type=delta] .fig-slider-input-container:before{background:var(--figma-color-bordertranslucent)!important;--left-start:calc(var(--start-percent) - var(--slider-thumb-width) / 2)!important;left:min(var(--left-start), calc(var(--slider-percent) - var(--slider-complete) * var(--slider-thumb-width)))!important;--width:calc(var(--slider-percent) - var(--start-percent))!important;--abs-width:max(calc(var(--width) + var(--slider-thumb-width) / 2 + (1 - var(--slider-complete)) * var(--slider-thumb-width)), calc(-1 * var(--width) + var(--slider-thumb-width) / 2 + var(--slider-complete) * var(--slider-thumb-width)))!important;width:var(--abs-width)!important}&:is([type=hue],[type=opacity]){& .fig-slider-input-container{&:after{content:"";z-index:0;pointer-events:none;border-radius:var(--slider-border-radius);position:absolute;inset:0}& input[type=range]{z-index:1;position:relative;&::-webkit-slider-runnable-track{background:0 0}&::-moz-range-track{background:0 0}}}}&[type=hue] .fig-slider-input-container{--propskit-slider-hue-color:hsl(calc(var(--slider-complete) * 360deg) 100% 50%);background:var(--propskit-slider-hue-color)!important;&:after{box-sizing:border-box;background:var(--bg-hue);border:0;border-radius:0;height:3px;inset:auto 0 0;-webkit-mask-image:none;mask-image:none;box-shadow:none!important}}&[type=opacity] .fig-slider-input-container{--propskit-slider-opacity-color:color-mix(in srgb, var(--color) calc(var(--slider-complete) * 100%), transparent);--propskit-slider-strip-effective-color:color-mix(in srgb, var(--color) calc(var(--slider-complete) * 100%), var(--figma-color-bg-secondary));--propskit-slider-strip-border-color:light-dark(oklch(from var(--propskit-slider-strip-effective-color) clamp(0, calc(l - .08), .85) c h),oklch(from var(--propskit-slider-strip-effective-color) clamp(.4, calc(l + .08), 1) c h));&:before{opacity:1;display:block;box-shadow:none!important;background:linear-gradient(var(--propskit-slider-opacity-color), var(--propskit-slider-opacity-color)), var(--slider-checkerboard)!important}&:after{box-sizing:border-box;width:var(--propskit-slider-progress-percent);border:1px solid var(--propskit-slider-strip-border-color);mix-blend-mode:normal;opacity:clamp(0, var(--slider-complete) * 1000, 1);background:0 0;inset:0 auto 0 0;box-shadow:none!important}}}& datalist{mask-image:linear-gradient(to right, transparent 0, transparent var(--spacer-4), white, transparent calc(100% - var(--spacer-4)), transparent 100%)}& fig-input-number{right:var(--propskit-slider-number-right);z-index:2;height:var(--control-height);border-radius:var(--radius-medium);background-color:#0000;border-left:0;flex:none;width:fit-content;min-width:fit-content;max-width:max-content;position:absolute;top:50%;bottom:auto;transform:translateY(-50%);box-shadow:none!important;outline:none!important;&:hover,&:has(input:focus){box-shadow:none!important;outline:none!important}& input{field-sizing:content;font-variant-numeric:tabular-nums;border-radius:var(--radius-medium);text-align:right;width:auto;color:var(--field-text-color);cursor:ew-resize;touch-action:none;flex:none;&:focus{cursor:text;touch-action:auto}}}}&[type=opacity][color]{& fig-slider{container-type:inline-size}& .propskit-slider-surface>label{--propskit-slider-label-fill-edge:clamp(0%, calc(var(--propskit-slider-complete,0) * 133.333%), 100%);background-image:linear-gradient(to right, var(--propskit-slider-filled-text-color) 0 var(--propskit-slider-label-fill-edge), var(--figma-color-text-secondary) var(--propskit-slider-label-fill-edge) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;color:#0000!important}& fig-input-number[theme] input{--propskit-slider-number-fill-edge:clamp(0px, calc(100% + var(--propskit-slider-number-right) - (1 - var(--slider-complete)) * 100cqw), 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(to right, var(--propskit-slider-filled-text-color) 0 var(--propskit-slider-number-fill-edge), var(--figma-color-text) var(--propskit-slider-number-fill-edge) 100%)!important;color:#0000!important}}&[data-elastic-dragging=true]{transform:scaleX(var(--propskit-slider-elastic-scale));transition:none}}propskit-slider input[type=range]:active::-webkit-slider-thumb{cursor:ew-resize}propskit-slider input[type=range]:active::-moz-range-thumb{cursor:ew-resize}propskit-slider input[type=range]::-webkit-slider-thumb{transform:scale(var(--propskit-slider-handle-scale));transform-origin:50%}propskit-slider input[type=range]::-moz-range-thumb{transform:scale(var(--propskit-slider-handle-scale));transform-origin:50%}fig-input-wheel{--fig-input-wheel-handle-drag-max:.5rem;--fig-input-wheel-handle-drag-offset:0px;--fig-input-wheel-handle-spring:.28s cubic-bezier(.34, 1.56, .64, 1);--fig-input-wheel-keyboard-handle-spring:.14s cubic-bezier(.34, 1.56, .64, 1);--fig-input-wheel-tick-width:.125rem;--fig-input-wheel-tick-width-min:1px;--fig-input-wheel-tick-height:calc(var(--fig-input-wheel-handle-height) - 4px);--fig-input-wheel-tick-height-min:8px;--fig-input-wheel-tick-fade:1rem;--fig-input-wheel-tick-opacity:.5;--fig-input-wheel-tick-opacity-min:.1;--fig-input-wheel-fast-tick-blur:2px;--fig-input-wheel-handle-width:var(--spacer-1);--fig-input-wheel-handle-height:calc(var(--control-height) - var(--spacer-2));--fig-input-wheel-handle-color:light-dark(var(--figma-color-text-secondary),var(--figma-color-text));box-sizing:border-box;width:100%;height:var(--control-height);border-radius:var(--radius-medium);background-color:var(--figma-color-bg-secondary);cursor:ew-resize;outline:none;display:block;position:relative;&:focus-visible{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&[disabled]:not([disabled=false]){pointer-events:none;opacity:.5}& .fig-input-wheel-svg{width:calc(100% - var(--spacer-3));height:100%;margin-inline:var(--spacer-2);color:var(--figma-color-icon-tertiary);mask-image:linear-gradient(to right, rgb(0 0 0/var(--fig-input-wheel-tick-opacity-min)) 0, rgb(0 0 0/var(--fig-input-wheel-tick-opacity)) var(--fig-input-wheel-tick-fade), rgb(0 0 0/var(--fig-input-wheel-tick-opacity)) calc(100% - var(--fig-input-wheel-tick-fade)), rgb(0 0 0/var(--fig-input-wheel-tick-opacity-min)) 100%);display:block;overflow:visible}& .fig-input-wheel-tick{fill:currentColor;stroke:none;transition:filter .12s ease-out}& .fig-input-wheel-handle{z-index:1;width:var(--fig-input-wheel-handle-width);height:var(--fig-input-wheel-handle-height);border-radius:calc(var(--fig-input-wheel-handle-width) / 2);pointer-events:none;transform:translate(calc(-50% + var(--fig-input-wheel-handle-drag-offset)), -50%);transition:transform var(--fig-input-wheel-handle-spring);box-shadow:inset 0 0 0 var(--fig-input-wheel-handle-height) var(--fig-input-wheel-handle-color);background:0 0;position:absolute;top:50%;left:50%}&[data-fig-input-wheel-active] .fig-input-wheel-handle{transition:none}&[data-fig-input-wheel-fast] .fig-input-wheel-tick{filter:blur(var(--fig-input-wheel-fast-tick-blur));transition:none}&[data-fig-input-wheel-keyboard-moving] .fig-input-wheel-handle{transition:none}&[data-fig-input-wheel-keyboard-settling] .fig-input-wheel-handle{transition:transform var(--fig-input-wheel-keyboard-handle-spring)}}propskit-wheel{--propskit-wheel-elastic-distance:calc(var(--spacer-2) + .25rem);--propskit-wheel-elastic-scale:1;--propskit-wheel-elastic-origin:left center;--propskit-wheel-elastic-transition:.28s cubic-bezier(.34, 1.56, .64, 1);--propskit-wheel-height:2rem;--_propskit-padding-block:var(--propskit-wheel-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-wheel-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-wheel-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-wheel-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-wheel-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-wheel-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-wheel-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-wheel-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-wheel-label-inline-size,var(--propskit-label-inline-size,75%));--_propskit-input-inline-size:var(--propskit-wheel-input-inline-size,var(--propskit-input-inline-size,fit-content));--propskit-wheel-number-right:calc(2px + var(--spacer-1));--propskit-wheel-track-inset:3rem;--propskit-wheel-track-inset-left:var(--propskit-wheel-track-inset);--propskit-wheel-track-inset-right:var(--propskit-wheel-track-inset);--figma-focus-outline-offset:1px;box-sizing:border-box;width:100%;height:calc(var(--propskit-wheel-height) + var(--_propskit-padding-block) * 2);transform-origin:var(--propskit-wheel-elastic-origin);transition:transform var(--propskit-wheel-elastic-transition);padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;position:relative;&[data-label-empty]{--propskit-wheel-track-inset-left:var(--spacer-2)}&[text=false]{--propskit-wheel-track-inset-right:var(--spacer-2)}&[disabled]:not([disabled=false]){pointer-events:none;& label,& input{color:var(--figma-color-text-disabled)}}& .propskit-wheel-surface{box-sizing:border-box;border-radius:var(--radius-medium-large);background:var(--_propskit-background);width:100%;height:100%;color:var(--_propskit-color);cursor:ew-resize;touch-action:none;user-select:none;display:block;position:relative;overflow:hidden;&:focus-within{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;box-sizing:border-box;width:var(--_propskit-label-inline-size);max-width:var(--_propskit-label-inline-size);color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;align-content:center;padding-inline-start:var(--spacer-2-5);display:block;position:absolute;inset:0;overflow:hidden}}& .propskit-wheel-surface>fig-input-wheel{--fig-input-wheel-handle-height:calc(var(--propskit-wheel-height) - var(--spacer-3));inset:0 var(--propskit-wheel-track-inset-right) 0 var(--propskit-wheel-track-inset-left);z-index:0;background-color:#0000;outline:none;width:auto;height:100%;transition:none;position:absolute;transform:none}& fig-input-number{font-variant-numeric:var(--font-variant-numeric);inset-inline-end:var(--propskit-wheel-number-right);z-index:2;height:var(--control-height);width:var(--_propskit-input-inline-size);border-radius:var(--radius-medium);background-color:#0000;border:0;flex:none;min-width:fit-content;max-width:max-content;position:absolute;top:50%;bottom:auto;transform:translateY(-50%);box-shadow:none!important;outline:none!important;&:hover,&:has(input:focus){box-shadow:none!important;outline:none!important}& input{field-sizing:content;text-align:right;cursor:ew-resize;touch-action:none;user-select:text;flex:none;width:auto;&:focus{cursor:text;touch-action:auto}}}&[data-propskit-wheel-elastic-dragging]{transform:scaleX(var(--propskit-wheel-elastic-scale));transition:none}}body.fig-input-wheel-dragging,body.fig-input-wheel-dragging *,body.propskit-slider-dragging,body.propskit-slider-dragging *{cursor:grabbing!important;-webkit-user-select:none!important;user-select:none!important}@media (prefers-reduced-motion:reduce){propskit-wheel,fig-input-wheel .fig-input-wheel-tick,fig-input-wheel .fig-input-wheel-handle{transition:none}}:is(.propskit-switch-surface,.propskit-color-surface,.propskit-fill-surface,.propskit-gradient-surface,.propskit-select-surface,.propskit-slider-surface)>label{z-index:1;box-sizing:border-box;width:var(--_propskit-label-inline-size);max-width:var(--_propskit-label-inline-size);text-overflow:ellipsis;white-space:nowrap;pointer-events:none;align-content:center;padding-inline-start:var(--spacer-2-5);display:block;position:absolute;inset:0;overflow:hidden}propskit-color-point,propskit-point-point,propskit-point-radius,propskit-point-radius-angle{display:contents}propskit-position{--propskit-position-height:2rem;--_propskit-padding-block:var(--propskit-position-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-position-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-position-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-position-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-position-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-position-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-position-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-position-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-position-label-inline-size,var(--propskit-label-inline-size,auto));--_propskit-input-inline-size:var(--propskit-position-input-inline-size,var(--propskit-input-inline-size,3.85rem));--figma-focus-outline-offset:1px;gap:var(--spacer-1);box-sizing:border-box;width:100%;padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);flex-direction:column;display:flex;&[disabled]:not([disabled=false]){pointer-events:none;& .propskit-position-surface>label{color:var(--figma-color-text-disabled)}}& .propskit-position-surface{box-sizing:border-box;width:100%;min-width:0;height:var(--propskit-position-height);min-height:var(--propskit-position-height);padding-inline:var(--spacer-2-5) var(--spacer-1);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);align-items:center;display:flex;position:relative;&:after{content:"";border-radius:inherit;border:var(--_propskit-border);pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{z-index:1;inline-size:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;flex:auto;align-items:center;margin:0 auto 0 0;padding:0;display:flex;position:relative;overflow:hidden}&>[data-propskit-position-axis]{z-index:1;flex:0 auto;min-width:0;position:relative}}& fig-input-number{width:var(--_propskit-input-inline-size);height:var(--control-height);box-shadow:none;background-color:#0000;border:0;outline:none!important;&:hover,&:focus-within{box-shadow:none;background-color:#0000;border:0;outline:none!important}}}propskit-joystick{--_propskit-padding-block:var(--propskit-joystick-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-joystick-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-joystick-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-joystick-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-joystick-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-joystick-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-joystick-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-joystick-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-joystick-label-inline-size,var(--propskit-label-inline-size,100%));--_propskit-input-inline-size:var(--propskit-joystick-input-inline-size,var(--propskit-input-inline-size,100%));box-sizing:border-box;width:100%;padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;& .propskit-joystick-surface{align-items:stretch;gap:var(--spacer-2);box-sizing:border-box;width:100%;min-width:0;padding:var(--spacer-2);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);flex-direction:column;display:flex;position:relative;&:after{content:"";border:var(--_propskit-border);border-radius:inherit;pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{width:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;margin:0;padding:0;padding-inline-start:calc(var(--spacer-2-5) - var(--spacer-2));display:block;overflow:hidden}}& fig-joystick{--size:100%;width:var(--_propskit-input-inline-size);align-self:flex-end;min-width:0;& .fig-input-joystick-guides{background-color:var(--propskit-bg-subfield,#ffffff0d);--figma-color-border:var(--propskit-color-border-subfield,var(--figma-color-bordertranslucent))}& .joystick-values>fig-input-number{background-color:var(--propskit-bg-subfield,#ffffff0d);box-shadow:none;border:0}& .fig-joystick-reset{display:none}}&[variant=minimal] .propskit-joystick-surface{background:0 0}&[disabled]:not([disabled=false]){& .propskit-joystick-surface{color:var(--figma-color-text-disabled)}& fig-joystick{filter:grayscale();opacity:.5}}}propskit-origin{--_propskit-padding-block:var(--propskit-origin-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-origin-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-origin-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-origin-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-origin-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-origin-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-origin-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-origin-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-origin-label-inline-size,var(--propskit-label-inline-size,100%));--_propskit-input-inline-size:var(--propskit-origin-input-inline-size,var(--propskit-input-inline-size,100%))}propskit-easing{--_propskit-padding-block:var(--propskit-easing-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-easing-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-easing-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-easing-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-easing-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-easing-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-easing-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-easing-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-easing-label-inline-size,var(--propskit-label-inline-size,100%));--_propskit-input-inline-size:var(--propskit-easing-input-inline-size,var(--propskit-input-inline-size,100%))}propskit-spring{--_propskit-padding-block:var(--propskit-spring-padding-block,var(--propskit-padding-block,var(--spacer-1)));--_propskit-padding-inline:var(--propskit-spring-padding-inline,var(--propskit-padding-inline,var(--spacer-3)));--_propskit-background:var(--propskit-spring-background,var(--propskit-background,var(--figma-color-bg-secondary)));--_propskit-border:var(--propskit-spring-border,var(--propskit-border,0 solid transparent));--_propskit-color:var(--propskit-spring-color,var(--propskit-color,var(--figma-color-text-secondary)));--_propskit-hover-background:var(--propskit-spring-hover-background,var(--propskit-hover-background,var(--_propskit-background)));--_propskit-hover-border:var(--propskit-spring-hover-border,var(--propskit-hover-border,1px solid var(--figma-color-bordertranslucent)));--_propskit-hover-color:var(--propskit-spring-hover-color,var(--propskit-hover-color,var(--_propskit-color)));--_propskit-label-inline-size:var(--propskit-spring-label-inline-size,var(--propskit-label-inline-size,100%));--_propskit-input-inline-size:var(--propskit-spring-input-inline-size,var(--propskit-input-inline-size,100%))}:is(propskit-origin,propskit-easing,propskit-spring){box-sizing:border-box;width:100%;padding-block:var(--_propskit-padding-block);padding-inline:var(--_propskit-padding-inline);display:block;&>:is(.propskit-origin-surface,.propskit-easing-surface,.propskit-spring-surface){align-items:stretch;gap:var(--spacer-2);box-sizing:border-box;width:100%;min-width:0;padding:var(--spacer-2);border-radius:var(--radius-medium-large);background:var(--_propskit-background);color:var(--_propskit-color);flex-direction:column;display:flex;position:relative;&:after{content:"";border:var(--_propskit-border);border-radius:inherit;pointer-events:none;position:absolute;inset:0}&:hover{background:var(--_propskit-hover-background);color:var(--_propskit-hover-color);&:after{border:var(--_propskit-hover-border)}}&>label{width:var(--_propskit-label-inline-size);min-width:0;color:inherit;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;margin:0;padding:0;padding-inline-start:calc(var(--spacer-2-5) - var(--spacer-2));display:block;overflow:hidden}}&[variant=minimal]>:is(.propskit-origin-surface,.propskit-easing-surface,.propskit-spring-surface){background:0 0}&[disabled]:not([disabled=false]){&>:is(.propskit-origin-surface,.propskit-easing-surface,.propskit-spring-surface){color:var(--figma-color-text-disabled)}& :is(fig-origin-grid,fig-easing-curve){filter:grayscale();opacity:.5}}}propskit-origin{& fig-origin-grid{--figma-color-border:var(--propskit-color-border-subfield,var(--figma-color-bordertranslucent));width:var(--_propskit-input-inline-size);align-self:flex-end;min-width:0;& .origin-grid,& .origin-values>fig-input-number{background-color:var(--propskit-bg-subfield,#ffffff0d)}}}:is(propskit-easing,propskit-spring){& fig-easing-curve{--figma-color-border:var(--propskit-color-border-subfield,var(--figma-color-bordertranslucent));width:var(--_propskit-input-inline-size);align-self:flex-end;min-width:0;& .fig-easing-curve-svg-container,& .fig-easing-curve-value-input{background-color:var(--propskit-bg-subfield,#ffffff0d)}& .fig-easing-curve-boundary,& .fig-easing-curve-target{stroke:var(--propskit-color-border-subfield,var(--figma-color-bordertranslucent))}}}:is(propskit-easing,propskit-spring) fig-easing-curve .fig-easing-curve-select{background-color:var(--propskit-bg-subfield,#ffffff0d);&:hover:not([disabled]):not([disabled=false]){background-color:var(--propskit-bg-subfield,#ffffff0d)}}:is(propskit-number,propskit-position,propskit-joystick,propskit-origin) fig-input-number:is(:focus-within,:active,:has(input:active)),propskit-text fig-input-text:is(:focus-within,:active,:has(:is(input,textarea):active)),:is(propskit-slider,propskit-wheel) fig-input-number:has(input:focus){background-color:var(--figma-color-bg)}:is(propskit-palette,propskit-select,propskit-text,propskit-number,propskit-slider,propskit-wheel) :is(.propskit-palette-surface,.propskit-select-surface,.propskit-text-surface,.propskit-number-surface,.propskit-slider-surface,.propskit-wheel-surface):focus-within,:is(propskit-color,propskit-fill,propskit-gradient):is(:focus-within,.has-popup-open) :is(.propskit-color-surface,.propskit-fill-surface,.propskit-gradient-surface){outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset);outline-color:#0000;overflow:visible;&:before{content:"";inset:calc(-1px - var(--figma-focus-outline-offset));box-sizing:border-box;border:var(--figma-focus-outline);border-radius:calc(var(--figma-focus-outline-radius) + var(--figma-focus-outline-offset) + 1px);pointer-events:none;z-index:4;position:absolute}}:is(.propskit-palette-surface,.propskit-select-surface) fig-select::part(trigger){outline:none}body{--fig-lab-cursor:url("data:image/svg+xml,<svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g clip-path=\"url(%23clip0_20065_231516)\"><g filter=\"url(%23filter0_d_20065_231516)\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2.93938 2.93938C3.35531 2.52345 3.97597 2.38901 4.52673 2.59555L15.5267 6.72055C16.1416 6.95111 16.535 7.55477 16.4976 8.21034C16.4603 8.86592 16.0009 9.421 15.3638 9.58026L10.737 10.737L9.58026 15.3638C9.421 16.0009 8.86592 16.4603 8.21034 16.4976C7.55477 16.535 6.95111 16.1416 6.72055 15.5267L2.59555 4.52673C2.38901 3.97597 2.52345 3.35531 2.93938 2.93938Z\" fill=\"white\"/></g><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4.17558 3.53185C3.99199 3.463 3.7851 3.50782 3.64646 3.64646C3.50782 3.7851 3.463 3.99199 3.53185 4.17558L7.65685 15.1756C7.7337 15.3805 7.93492 15.5117 8.15345 15.4992C8.37197 15.4868 8.557 15.3336 8.61009 15.1213L9.91232 9.91232L15.1213 8.61009C15.3336 8.557 15.4868 8.37197 15.4992 8.15345C15.5117 7.93492 15.3805 7.7337 15.1756 7.65685L4.17558 3.53185Z\" fill=\"black\"/></g><defs><filter id=\"filter0_d_20065_231516\" x=\"-0.5\" y=\"0.5\" width=\"20\" height=\"20\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\"><feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/><feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/><feOffset dy=\"1\"/><feGaussianBlur stdDeviation=\"1.5\"/><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0\"/><feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_20065_231516\"/><feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_20065_231516\" result=\"shape\"/></filter><clipPath id=\"clip0_20065_231516\"><rect width=\"32\" height=\"32\" fill=\"white\"/></clipPath></defs></svg>") 3 3, default;--fig-lab-cursor-eyedropper:url("data:image/svg+xml,<svg width=\"33\" height=\"32\" viewBox=\"0 0 33 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g filter=\"url(%23filter0_d_20089_234507)\"><path d=\"M21.9392 13.4383C23.0416 12.3365 24.8073 12.3025 25.951 13.3347L26.0594 13.4383L26.1629 13.5476C27.1956 14.6911 27.1633 16.4583 26.0603 17.5613L25.118 18.5027C25.9194 19.3681 25.9023 20.7185 25.0613 21.5603L25.0603 21.5613C24.2185 22.4021 22.8681 22.4194 22.0027 21.618L18.1668 25.4549C17.8885 25.7327 17.5329 25.9242 17.1453 26.0017L15.5291 26.325C14.1302 26.6042 12.8971 25.3697 13.1756 23.9715L13.4988 22.3553C13.5763 21.9677 13.7679 21.6121 14.0457 21.3338L17.8806 17.4969C17.0787 16.6304 17.1 15.2789 17.9402 14.4383C18.7815 13.598 20.1303 13.58 20.9959 14.3806L21.9392 13.4383ZM17.4597 24.7469C17.3202 24.8861 17.1423 24.9816 16.949 25.0203L15.3328 25.3435C15.2891 25.3522 15.2458 25.359 15.2029 25.3621C15.2458 25.3593 15.2892 25.3532 15.3328 25.3445L16.949 25.0213C16.9976 25.0116 17.0453 24.998 17.0916 24.9812C17.1376 24.9647 17.1824 24.9447 17.2254 24.9217C17.2681 24.8987 17.3094 24.8725 17.3484 24.8435L17.4597 24.7478L21.9998 20.2078L22.6463 20.8543C22.6738 20.8817 22.7028 20.9072 22.7322 20.9314C22.7028 20.9071 22.6738 20.8808 22.6463 20.8533L21.9998 20.2068L17.4597 24.7469ZM14.156 24.1678C14.1474 24.2113 14.1414 24.2549 14.1385 24.2976C14.1355 24.3404 14.135 24.383 14.1375 24.4246C14.1425 24.5086 14.1584 24.5903 14.1834 24.6678V24.6658C14.1342 24.5118 14.1212 24.3417 14.156 24.1668V24.1678ZM15.4597 22.7469L15.1375 24.3631L15.4597 22.7478L19.9988 18.2078L21.2918 19.4998H21.2928L19.9988 18.2068L15.4597 22.7469ZM24.3533 20.8533C24.3257 20.8809 24.2969 20.9071 24.2674 20.9314L24.3533 20.8543C24.3827 20.8248 24.4105 20.7941 24.4363 20.7625C24.4106 20.7938 24.3826 20.824 24.3533 20.8533ZM22.2928 18.5008L23.6463 19.8543C23.6562 19.8643 23.6652 19.8752 23.6726 19.8865L23.6463 19.8533L22.2928 18.4998V18.5008ZM25.3533 16.8533L23.7068 18.4998L25.3533 16.8543C25.3991 16.8085 25.4411 16.7598 25.4812 16.7107C25.4412 16.7596 25.3989 16.8077 25.3533 16.8533ZM18.5232 16.7097C18.5597 16.7602 18.6 16.809 18.6453 16.8543L19.2908 17.4998H19.2918L18.6453 16.8533C18.6002 16.8081 18.5596 16.7598 18.5232 16.7097ZM23.3533 14.8523L20.9998 17.2058L19.6463 15.8523C19.5654 15.772 19.4341 15.7719 19.3533 15.8523C19.3404 15.8653 19.3299 15.8801 19.3211 15.8953C19.3298 15.8803 19.3406 15.8661 19.3533 15.8533C19.4342 15.7725 19.5654 15.7727 19.6463 15.8533L20.9998 17.2068L23.3533 14.8533C23.3756 14.831 23.3987 14.8093 23.4226 14.7898L23.3533 14.8523ZM3.43924 2.93924C3.85511 2.52338 4.47546 2.3891 5.02616 2.59549L16.0262 6.72049C16.6409 6.95101 17.035 7.55433 16.9978 8.20975C16.9605 8.86518 16.5009 9.42047 15.864 9.57987L11.2371 10.7371L10.0799 15.364C9.92047 16.0009 9.36518 16.4605 8.70975 16.4978C8.05433 16.535 7.45101 16.1409 7.22049 15.5262L3.09549 4.52616C2.8891 3.97546 3.02338 3.35511 3.43924 2.93924ZM18.4959 15.3279C18.4915 15.3345 18.4875 15.3417 18.4832 15.3484C18.5076 15.3103 18.5341 15.2728 18.5633 15.2371L18.4959 15.3279ZM24.6453 14.8533C24.682 14.8901 24.7147 14.9296 24.7439 14.9705C24.7147 14.9294 24.6821 14.8892 24.6453 14.8523C24.637 14.844 24.6275 14.8367 24.6189 14.8289C24.6276 14.837 24.6368 14.8449 24.6453 14.8533ZM25.5974 14.4461C25.631 14.4969 25.662 14.5492 25.6902 14.6023C25.6326 14.4937 25.5642 14.389 25.4842 14.2908L25.5974 14.4461ZM24.1668 13.5935C24.157 13.5927 24.1473 13.5913 24.1375 13.5906L23.9998 13.5857C24.0555 13.5857 24.1112 13.5887 24.1668 13.5935Z\" fill=\"white\"/></g><path d=\"M22.6472 14.1463C23.3946 13.3992 24.6058 13.3992 25.3532 14.1463C26.1005 14.8938 26.1005 16.1059 25.3532 16.8533L23.7077 18.4988L24.3542 19.1453C24.8254 19.6168 24.8253 20.3809 24.3542 20.8524C23.8828 21.3237 23.1186 21.3236 22.6472 20.8524L22.0007 20.2069L17.4606 24.7459C17.3211 24.8853 17.1433 24.9806 16.9499 25.0194L15.3337 25.3426C14.6341 25.4823 14.0172 24.8654 14.1569 24.1658L14.4802 22.5506C14.5189 22.3572 14.6142 22.1784 14.7536 22.0389L19.2927 17.4988L18.6462 16.8524C18.1752 16.3809 18.1759 15.6157 18.6472 15.1444C19.1185 14.6737 19.8829 14.6736 20.3542 15.1444L21.0007 15.7908L22.6472 14.1463ZM15.4606 22.7459L15.1374 24.3621L16.7536 24.0389L21.2936 19.4998L19.9997 18.2059L15.4606 22.7459ZM4.14618 3.64631C4.28483 3.50767 4.49189 3.46321 4.67548 3.53205L15.6755 7.65705C15.8803 7.73388 16.011 7.93474 15.9987 8.15315C15.9863 8.37167 15.8331 8.55709 15.6208 8.61018L10.4118 9.91194L9.11005 15.1209C9.05696 15.3333 8.87154 15.4864 8.65302 15.4988C8.43465 15.5111 8.23375 15.3804 8.15692 15.1756L4.03192 4.17561C3.96308 3.99203 4.00756 3.78495 4.14618 3.64631Z\" fill=\"black\"/><defs><filter id=\"filter0_d_20089_234507\" x=\"0\" y=\"0.5\" width=\"29.9133\" height=\"29.8647\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\"><feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/><feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/><feOffset dy=\"1\"/><feGaussianBlur stdDeviation=\"1.5\"/><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0\"/><feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_20089_234507\"/><feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_20089_234507\" result=\"shape\"/></filter></defs></svg>") 3 3, crosshair;--fig-lab-cursor-move:url("data:image/svg+xml,<svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g clip-path=\"url(%23clip0_20065_165164)\"><g filter=\"url(%23filter0_d_20065_165164)\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2.93938 2.93938C3.35531 2.52345 3.97597 2.38901 4.52673 2.59555L15.5267 6.72055C16.1416 6.95111 16.535 7.55477 16.4976 8.21034C16.4603 8.86592 16.0009 9.421 15.3638 9.58026L10.737 10.737L9.58026 15.3638C9.421 16.0009 8.86592 16.4603 8.21034 16.4976C7.55477 16.535 6.95111 16.1416 6.72055 15.5267L2.59555 4.52673C2.38901 3.97597 2.52345 3.35531 2.93938 2.93938Z\" fill=\"white\"/><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M18.4394 12.9394C19.0252 12.3536 19.9749 12.3536 20.5607 12.9394L26.0607 18.4394C26.6465 19.0252 26.6465 19.9749 26.0607 20.5607L20.5607 26.0607C19.9749 26.6465 19.0252 26.6465 18.4394 26.0607L12.9394 20.5607C12.3536 19.9749 12.3536 19.0252 12.9394 18.4394L18.4394 12.9394Z\" fill=\"white\"/></g><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4.17558 3.53185C3.99199 3.463 3.7851 3.50782 3.64646 3.64646C3.50782 3.7851 3.463 3.99199 3.53185 4.17558L7.65685 15.1756C7.7337 15.3805 7.93492 15.5117 8.15345 15.4992C8.37197 15.4868 8.557 15.3336 8.61009 15.1213L9.91232 9.91232L15.1213 8.61009C15.3336 8.557 15.4868 8.37197 15.4992 8.15345C15.5117 7.93492 15.3805 7.7337 15.1756 7.65685L4.17558 3.53185Z\" fill=\"black\"/><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M19.1464 13.6464C19.3417 13.4512 19.6583 13.4512 19.8536 13.6464L21.8536 15.6464C22.0488 15.8417 22.0488 16.1583 21.8536 16.3536C21.6583 16.5488 21.3417 16.5488 21.1464 16.3536L20 15.2071V19H23.7929L22.6464 17.8536C22.4512 17.6583 22.4512 17.3417 22.6464 17.1464C22.8417 16.9512 23.1583 16.9512 23.3536 17.1464L25.3536 19.1464C25.5488 19.3417 25.5488 19.6583 25.3536 19.8536L23.3536 21.8536C23.1583 22.0488 22.8417 22.0488 22.6464 21.8536C22.4512 21.6583 22.4512 21.3417 22.6464 21.1464L23.7929 20H20V23.7929L21.1464 22.6464C21.3417 22.4512 21.6583 22.4512 21.8536 22.6464C22.0488 22.8417 22.0488 23.1583 21.8536 23.3536L19.8536 25.3536C19.6583 25.5488 19.3417 25.5488 19.1464 25.3536L17.1464 23.3536C16.9512 23.1583 16.9512 22.8417 17.1464 22.6464C17.3417 22.4512 17.6583 22.4512 17.8536 22.6464L19 23.7929V20H15.2071L16.3536 21.1464C16.5488 21.3417 16.5488 21.6583 16.3536 21.8536C16.1583 22.0488 15.8417 22.0488 15.6464 21.8536L13.6464 19.8536C13.4512 19.6583 13.4512 19.3417 13.6464 19.1464L15.6464 17.1464C15.8417 16.9512 16.1583 16.9512 16.3536 17.1464C16.5488 17.3417 16.5488 17.6583 16.3536 17.8536L15.2071 19H19V15.2071L17.8536 16.3536C17.6583 16.5488 17.3417 16.5488 17.1464 16.3536C16.9512 16.1583 16.9512 15.8417 17.1464 15.6464L19.1464 13.6464Z\" fill=\"black\"/></g><defs><filter id=\"filter0_d_20065_165164\" x=\"-0.5\" y=\"0.5\" width=\"30\" height=\"30\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\"><feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/><feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/><feOffset dy=\"1\"/><feGaussianBlur stdDeviation=\"1.5\"/><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0\"/><feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_20065_165164\"/><feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_20065_165164\" result=\"shape\"/></filter><clipPath id=\"clip0_20065_165164\"><rect width=\"32\" height=\"32\" fill=\"white\"/></clipPath></defs></svg>") 3 3, move}body.fig-lab-move-active,body.fig-lab-move-active *{cursor:var(--fig-lab-cursor-move)!important}body.fig-lab-rotate-active,body.fig-lab-rotate-active *{cursor:var(--fig-lab-cursor-rotate)!important}fig-canvas-control{--fig-canvas-control-line-stroke:light-dark(#fff,#ffffff80);--fig-canvas-control-radius-stroke:#0d99ff;--fig-canvas-control-radius-stroke-halo:#fff0;--fig-canvas-control-stroke-halo:var(--fig-canvas-control-radius-stroke-halo);--fig-canvas-control-stroke-halo-hover:#fff;--fig-canvas-control-line-stroke-hover:#0d99ff;--fig-canvas-control-line-stroke-active:#0d99ff;--fig-canvas-control-line-stroke-width:1px;--fig-canvas-control-line-stroke-width-hover:2px;display:contents;&:has(.fig-canvas-control-radius-hit:hover,.fig-canvas-control-angle-line-hit:hover){--fig-canvas-control-line-stroke-width:var(--fig-canvas-control-line-stroke-width-hover);--fig-canvas-control-stroke-halo:var(--fig-canvas-control-stroke-halo-hover)}&>fig-handle,&>fig-tooltip:has(fig-handle:not([size=small])){z-index:1}& fig-handle{&[type=color]{--width:.75rem;--height:.75rem;--fig-handle-padding:1px;--fig-handle-shadow:none;&:hover,&:focus-within,&[selected]:not([selected=false]){--width:1rem;--height:1rem;--fig-handle-outline-color:transparent}&.dragging,&:active{--fig-handle-padding:2px!important}&[selected]:not([selected=false]){--fig-handle-padding:2px}}}& fig-handle:hover,& fig-handle:hover .fig-handle-hit-area:not([data-cursor]){cursor:var(--fig-lab-cursor)!important}&[type=color] fig-handle[type=color]:hover:not(:active,.active,.dragging),&[type=color] fig-handle[type=color]:hover:not(:active,.active,.dragging) .fig-handle-hit-area{cursor:var(--fig-lab-cursor-eyedropper)!important}& fig-handle:is(:active,.active,.dragging),& fig-handle:is(:active,.active,.dragging) .fig-handle-hit-area:not([data-cursor]){cursor:var(--fig-lab-cursor-move)!important}& .fig-canvas-control-angle-line-hit{cursor:var(--fig-lab-cursor-move)}& .fig-canvas-control-radius{pointer-events:none;position:absolute;overflow:visible;& circle{fill:none;stroke:var(--fig-canvas-control-radius-stroke);stroke-width:var(--fig-canvas-control-line-stroke-width);paint-order:stroke fill}& .fig-canvas-control-radius-halo{stroke:var(--fig-canvas-control-stroke-halo);stroke-width:calc(var(--fig-canvas-control-line-stroke-width) + 2px);filter:none}& .fig-canvas-control-radius-hit{stroke:#0000;stroke-width:12px;pointer-events:stroke;filter:none}}&.fig-canvas-control-ring-active{--fig-canvas-control-line-stroke-width:var(--fig-canvas-control-line-stroke-width-hover)}& .fig-canvas-control-angle-svg{pointer-events:none}& .fig-canvas-control-angle-line{stroke:var(--fig-canvas-control-radius-stroke);stroke-width:var(--fig-canvas-control-line-stroke-width);paint-order:stroke fill;filter:drop-shadow(0 0 .5px #0000004d)drop-shadow(0 .5px 1px #0000001f)}& .fig-canvas-control-angle-line-halo{stroke:var(--fig-canvas-control-stroke-halo);stroke-width:calc(var(--fig-canvas-control-line-stroke-width) + 2px);stroke-linecap:butt;filter:none}& fig-handle[size=small]{z-index:2;& .fig-handle-hit-area{cursor:grab}}}fig-input-angle{--size:1.5rem;align-items:center;gap:var(--spacer-2);user-select:none;display:inline-flex;&>fig-input-number{flex:none;width:auto}&[full]:not([full=false]){width:100%;display:flex;&>fig-input-number{flex:auto;width:auto;min-width:0}}fig-field:not([direction=vertical]) &{flex:1;min-width:0;& fig-input-number{flex:none;width:auto}}& .fig-input-angle-plane{width:var(--size);height:var(--size);aspect-ratio:1;background-color:var(--figma-color-bg-secondary);box-shadow:inset 0 0 0 1px var(--figma-color-border);border-radius:100%;flex-shrink:0;place-items:center;display:inline-grid;&:focus{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}&.dragging{box-shadow:inset 0 0 0 1px var(--figma-color-border-selected);outline:0}}& .fig-input-angle-handle{grid-area:1/1;place-items:center;width:calc(.5rem + 2px);height:calc(.5rem + 2px);display:inline-grid;&:before{content:"";background:var(--handle-color);width:.5rem;height:.5rem;box-shadow:var(--handle-shadow);border-radius:50%;display:block}}}propskit-oscillator{--aspect-ratio:2 / 1;--oscillator-stroke-width:2;--propskit-oscillator-playhead-radius:5px;flex-direction:column;width:100%;display:flex;& .propskit-oscillator-svg-container{border-radius:var(--radius-medium-large);padding:var(--spacer-3) var(--spacer-5);margin-bottom:var(--spacer-2);position:relative;overflow:hidden;&:before{inset:0 var(--spacer-3);content:"";background:var(--figma-color-bg-secondary);border-radius:var(--radius-medium-large);position:absolute}&:is(:hover,:active,:focus,:focus-visible,:focus-within){overflow:visible}& path{stroke:var(--figma-color-border-strong)}}& .propskit-oscillator-svg{width:100%;aspect-ratio:var(--aspect-ratio);z-index:1;display:block;position:relative;overflow:visible;& .propskit-oscillator-handle{opacity:0}&:hover,&:focus-within,&.dragging{& .propskit-oscillator-handle{opacity:1}}}& .propskit-oscillator-bounds{fill:#0000}& .propskit-oscillator-baseline{pointer-events:none;stroke:var(--figma-color-bordertranslucent);stroke-width:var(--oscillator-stroke-width);stroke-linecap:round}& .propskit-oscillator-path{pointer-events:none;fill:none;stroke:var(--figma-color-text);stroke-width:var(--oscillator-stroke-width);stroke-linejoin:round;stroke-linecap:round}& .propskit-oscillator-playhead{pointer-events:none;r:var(--propskit-oscillator-playhead-radius);fill:var(--handle-color);stroke:var(--figma-color-bg);stroke-width:1px}& .propskit-oscillator-handle{pointer-events:all;cursor:default;overflow:visible;& .propskit-oscillator-handle-inner{place-items:center;width:100%;height:100%;display:grid;overflow:visible}}& .propskit-oscillator-frequency-handle{cursor:ew-resize;& fig-handle,& fig-handle:hover,& fig-handle .fig-handle-hit-area,& fig-handle:hover .fig-handle-hit-area,& fig-handle:is(:active,.active,.dragging),& fig-handle:is(:active,.active,.dragging) .fig-handle-hit-area{cursor:ew-resize!important}}& .propskit-oscillator-amplitude-handle{cursor:ns-resize;& fig-handle,& fig-handle:hover,& fig-handle .fig-handle-hit-area,& fig-handle:hover .fig-handle-hit-area,& fig-handle:is(:active,.active,.dragging),& fig-handle:is(:active,.active,.dragging) .fig-handle-hit-area{cursor:ns-resize!important}}& .propskit-oscillator-waves{flex-direction:column;gap:0;display:flex}& .propskit-oscillator-wave{margin-bottom:0;&>fig-header{& .propskit-oscillator-remove-button,& .propskit-oscillator-add-type-button{flex-shrink:0}}}& .propskit-oscillator-field{width:100%}& .propskit-oscillator-add-type-button{width:var(--spacer-4);height:var(--spacer-4);min-width:var(--spacer-4)}&[disabled]:not([disabled=false]){pointer-events:none;opacity:.6}}fig-reorder{display:contents}fig-reorder:not([handle]):is(:not([disabled]),[disabled=false])>[data-reorder-item],fig-reorder:not([handle]):is(:not([disabled]),[disabled=false])>[data-reorder-item]>fig-header,fig-reorder:not([handle]):is(:not([disabled]),[disabled=false])>[data-reorder-item]>fig-header *,fig-reorder:not([handle]):is(:not([disabled]),[disabled=false])>[data-reorder-item]>label{cursor:grab}fig-reorder>.dragging{background-color:var(--figma-color-bg-selected)}[data-reorder-handle]{cursor:grab}fig-reorder[disabled]:not([disabled=false]) [data-reorder-handle]{cursor:inherit}body.fig-reorder-dragging,body.fig-reorder-dragging *{-webkit-user-select:none!important;user-select:none!important;cursor:grabbing!important}.fig-reorder-indicator{pointer-events:none;z-index:1000000;background:var(--figma-color-border-strong);position:fixed}.fig-reorder-indicator[data-axis=vertical]{height:2px}.fig-reorder-indicator[data-axis=horizontal]{width:2px}
|
package/fig-lab.css
CHANGED
|
@@ -2540,7 +2540,7 @@ propskit-position {
|
|
|
2540
2540
|
min-width: 0;
|
|
2541
2541
|
height: var(--propskit-position-height);
|
|
2542
2542
|
min-height: var(--propskit-position-height);
|
|
2543
|
-
padding-inline
|
|
2543
|
+
padding-inline: var(--spacer-2-5) var(--spacer-1);
|
|
2544
2544
|
border-radius: var(--radius-medium-large);
|
|
2545
2545
|
background: var(--_propskit-background);
|
|
2546
2546
|
color: var(--_propskit-color);
|
|
@@ -2605,9 +2605,6 @@ propskit-position {
|
|
|
2605
2605
|
}
|
|
2606
2606
|
}
|
|
2607
2607
|
|
|
2608
|
-
fig-input-number[data-propskit-position-axis="y"] {
|
|
2609
|
-
margin-left: calc(-1 * var(--spacer-2));
|
|
2610
|
-
}
|
|
2611
2608
|
}
|
|
2612
2609
|
|
|
2613
2610
|
propskit-joystick {
|
package/package.json
CHANGED