.figma-button[data-color=yellow][data-variant=primary]{--figma-button-background:#fda43a;--figma-button-text:#000;--figma-button-border:transparent;--figma-button-hover-background:#fdb661;--figma-button-hover-text:#000;--figma-button-hover-border:transparent;--figma-button-pressed-background:#cc6f00;--figma-button-pressed-text:#000;--figma-button-pressed-border:transparent}.figma-button[data-color=yellow][data-variant=secondary]{--figma-button-background:transparent;--figma-button-text:#fedaae;--figma-button-border:#89673f;--figma-button-hover-background:#fda43a;--figma-button-hover-text:#2e1501;--figma-button-hover-border:transparent;--figma-button-pressed-background:#cc6f00;--figma-button-pressed-text:#2e1501;--figma-button-pressed-border:#cc6f00}.figma-button[data-color=red][data-variant=primary]{--figma-button-background:#fd473a;--figma-button-text:#000;--figma-button-border:transparent;--figma-button-hover-background:#fd6c61;--figma-button-hover-text:#000;--figma-button-hover-border:transparent;--figma-button-pressed-background:#c0190e;--figma-button-pressed-text:#ffd9d9;--figma-button-pressed-border:transparent}.figma-button[data-color=red][data-variant=secondary]{--figma-button-background:transparent;--figma-button-text:#feb3ae;--figma-button-border:#89443f;--figma-button-hover-background:#fd473a;--figma-button-hover-text:#2e1501;--figma-button-hover-border:transparent;--figma-button-pressed-background:#c0190e;--figma-button-pressed-text:#ffd9d9;--figma-button-pressed-border:#c0190e}.figma-button[data-size=large]{--figma-button-height:36px;--figma-button-padding-y:0;--figma-button-padding-x:16px}.figma-button[data-size=small]{--figma-button-height:32px;--figma-button-padding-y:0;--figma-button-padding-x:12px}.figma-button[data-size=x-large]{--figma-button-height:48px;--figma-button-padding-y:0;--figma-button-padding-x:20px;--figma-button-font-size:14px}.figma-button{box-sizing:border-box;height:var(--figma-button-height,36px);padding:var(--figma-button-padding-y,0) var(--figma-button-padding-x,16px);justify-content:center;align-items:center;gap:var(--figma-button-gap,8px);font-family:var(--figma-button-font-family,"DM Sans", sans-serif);font-size:var(--figma-button-font-size,12px);font-weight:var(--figma-button-font-weight,600);line-height:var(--figma-button-line-height,1.25rem);letter-spacing:var(--figma-button-letter-spacing,normal);text-align:center;color:var(--figma-button-text,var(--primary-foreground));background:var(--figma-button-background,var(--primary));border:var(--figma-button-border-width,1px) solid var(--figma-button-border,transparent);border-radius:var(--figma-button-radius,5px);box-shadow:var(--figma-button-shadow,none);cursor:pointer;transition:background-color .15s,color .15s,border-color .15s;display:inline-flex}.figma-button:hover:not(:disabled){background:var(--figma-button-hover-background,color-mix(in oklch, var(--figma-button-background,var(--primary)) 90%, transparent));color:var(--figma-button-hover-text,var(--figma-button-text,var(--primary-foreground)));border-color:var(--figma-button-hover-border,var(--figma-button-border,transparent))}.figma-button:active:not(:disabled){background:var(--figma-button-pressed-background,var(--figma-button-background,var(--primary)));color:var(--figma-button-pressed-text,var(--figma-button-text,var(--primary-foreground)));border-color:var(--figma-button-pressed-border,var(--figma-button-border,transparent))}.figma-button:focus-visible{outline:var(--figma-button-focus-width,2px) solid var(--figma-button-focus-color,var(--ring));outline-offset:var(--figma-button-focus-offset,2px)}.figma-button:disabled{background:var(--figma-button-disabled-background,var(--figma-button-background,var(--primary)));color:var(--figma-button-disabled-text,var(--figma-button-text,var(--primary-foreground)));border-color:var(--figma-button-disabled-border,var(--figma-button-border,transparent));opacity:var(--figma-button-disabled-opacity,.5);cursor:not-allowed}.figma-button--full-width{width:100%}.figma-button__icon{width:var(--figma-button-icon-size,1rem);height:var(--figma-button-icon-size,1rem);pointer-events:none;flex:none;display:inline-flex}.figma-button__icon>svg{width:100%;height:100%}@media (prefers-reduced-motion:reduce){.figma-button{transition:none}}