.button{--btn-border-radius:var(--ui-border-radius,100vw);all:unset;appearance:none;box-sizing:border-box;border:1px solid var(--btn-border);border-radius:var(--btn-border-radius);background-color:var(--btn-background);width:fit-content;min-width:fit-content;font:inherit;color:var(--btn-foreground);white-space:nowrap;letter-spacing:0;justify-content:center;align-items:center;gap:0;padding:.25em 1.25em;font-size:.9375em;font-weight:700;line-height:1;text-decoration:none;transition:background-color .25s,border-color .25s,box-shadow .125s;display:inline-flex;position:relative}.button .icon{transition:transform .2s;transform:translate(-.05rem)}.button:hover{background-color:var(--btn-background-hover);color:var(--btn-foreground-hover);border-color:var(--btn-border-hover);cursor:pointer}.button:hover .icon-forward{transform:translate(.2rem)}@keyframes icon-hover{0%{opacity:1;transform:translate(0)}50%{opacity:0;transform:translate(.25rem)}51%{opacity:0}to{opacity:1;transform:translate(0)}}.button:focus{border-radius:var(--btn-border-radius);outline:none}.button:focus-visible{box-shadow:0 0 0 .25rem var(--btn-focus);outline:none}.button:active{background-color:var(--btn-background);color:var(--btn-foreground);border-color:var(--btn-border);transition:none}.button-text{margin:0 .5em;display:inline-block}.button .icon{color:inherit;fill:none;stroke:var(--btn-foreground);flex-shrink:0}.button.success{--btn-light:#10b98133;--btn-base:#059669;--btn-dark:#047857;--btn-background-subtle:color-mix(in srgb, transparent, var(--btn-light) 20%);--theme-ui-focus:var(--btn-base);--theme-ui-foreground:#fff;--theme-ui-background:var(--btn-base);--theme-ui-border:var(--btn-base);--theme-ui-foreground-hover:#fff;--theme-ui-background-hover:var(--btn-dark);--theme-ui-border-hover:var(--btn-base)}.button.warning{--btn-light:#fbbf2433;--btn-base:#fcd34d;--btn-dark:#92400e;--btn-background-subtle:color-mix(in srgb, transparent, var(--btn-light) 30%);--theme-ui-focus:#fcd34d80;--theme-ui-foreground:#0f3173;--theme-ui-background:var(--btn-base);--theme-ui-background-hover:var(--btn-light);--theme-ui-foreground-hover:#0f3173;--theme-ui-border:var(--btn-base);--theme-ui-border-hover:var(--btn-dark)}.button.danger{--btn-light:#f43f5e33;--btn-base:#e11d48;--btn-dark:#be123c;--btn-background-subtle:color-mix(in srgb, transparent, var(--btn-light) 20%);--theme-ui-focus:#e11d4880;--theme-ui-foreground:#fff;--theme-ui-background:var(--btn-base);--theme-ui-border:var(--btn-base);--theme-ui-foreground-hover:#fff;--theme-ui-background-hover:var(--btn-dark);--theme-ui-border-hover:var(--btn-base)}.button.info{--btn-light:#18b1f233;--btn-base:#009df2;--btn-dark:#117ddb;--btn-background-subtle:color-mix(in srgb, transparent, var(--btn-base) 20%);--theme-ui-focus:#009df280;--theme-ui-foreground:#0f3173;--theme-ui-background:var(--btn-base);--theme-ui-border:var(--btn-base);--theme-ui-foreground-hover:var(--btn-dark);--theme-ui-background-hover:var(--btn-light);--theme-ui-border-hover:var(--btn-dark)}.button.neutral{--btn-light:#a0b0bf33;--btn-base:#dce4ec;--btn-dark:#3a4b5c;--btn-background-subtle:color-mix(in srgb, transparent, var(--btn-base) 20%);--theme-ui-focus:#dce4ec80;--theme-ui-foreground:var(--btn-dark);--theme-ui-background:var(--btn-base);--theme-ui-border:var(--btn-dark);--theme-ui-background-hover:var(--btn-light);--theme-ui-foreground-hover:var(--btn-dark);--theme-ui-border-hover:var(--btn-dark)}.button.default{--btn-light:#7d8e9f;--btn-base:#0e3b8d;--btn-dark:#0f285a;--btn-background-subtle:color-mix(in srgb, transparent, var(--btn-light) 10%);--theme-ui-focus:inherit;--theme-ui-foreground:inherit;--theme-ui-background:inherit;--theme-ui-border:inherit;--theme-ui-background-hover:inherit;--theme-ui-foreground-hover:inherit;--theme-ui-border-hover:inherit}[data-theme=dark] .button.default,[data-theme=photo] .button.default{--btn-light:#fff;--btn-base:#fff;--btn-dark:#fff;--theme-ui-background-hover:#fffc}.button.solid{--btn-focus:var(--theme-ui-focus);--btn-foreground:var(--theme-ui-foreground);--btn-background:var(--theme-ui-background);--btn-border:transparent;--btn-foreground-hover:var(--theme-ui-foreground-hover);--btn-background-hover:var(--theme-ui-background-hover);--btn-border-hover:transparent}.button.outline{--btn-focus:var(--theme-ui-focus);--btn-foreground:var(--btn-dark);--btn-foreground-hover:var(--btn-dark);--btn-background:transparent;--btn-background-hover:color-mix(in srgb, var(--theme-ui-background), transparent 95%);--btn-border:var(--theme-ui-border);--btn-border-hover:var(--theme-ui-border);border-width:1.5px}.button.soft{--btn-focus:var(--theme-ui-focus);--btn-foreground:var(--btn-dark);--btn-background:var(--btn-background-subtle);--btn-border:color-mix(in srgb, transparent, var(--btn-light) 5%);--btn-foreground-hover:var(--btn-dark);--btn-background-hover:var(--btn-background-subtle);--btn-border-hover:color-mix(in srgb, transparent, var(--btn-light) 20%)}[data-theme=photo] .button.outline{backdrop-filter:blur(1.25rem)}[data-theme=photo] .button.soft,.button.glass{--btn-foreground:var(--theme-foreground);--btn-foreground-hover:var(--theme-foreground);--btn-background:#ffffff0d;--btn-background-hover:#ffffff1a;--btn-focus:var(--theme-ui-focus);--btn-border:#ffffff1a;--btn-border-hover:#ffffff1a;backdrop-filter:blur(1.25rem)}.button.ghost{--btn-foreground:var(--btn-dark);--btn-foreground-hover:var(--btn-dark);--btn-background:transparent;--btn-background-hover:transparent;--btn-focus:var(--theme-ui-focus);--btn-border:transparent;--btn-border-hover:color-mix(in srgb, var(--theme-ui-border), transparent 75%)}[data-theme=dark] .button.outline,[data-theme=dark] .button.soft,[data-theme=dark] .button.ghost,[data-theme=photo] .button.outline,[data-theme=photo] .button.soft,[data-theme=photo] .button.ghost{--btn-foreground:var(--btn-light);--btn-foreground-hover:var(--btn-light)}.button[disabled]{cursor:not-allowed;--btn-background:red;--btn-foreground:blue}.button.xs{min-height:1.75rem;padding:.1em 1em;font-size:.775em}.button.sm{min-height:2.25rem;padding:.25em 1em .3em;font-size:.8125em}.button.md{min-height:2.75rem;padding:.25em 1.25em;font-size:.9375em}.button.lg{min-height:3rem;padding:.25em 1.25em;font-size:1em}.button.xl{min-height:3.5rem;padding:.25em 1.5em;font-size:1.05em}.button.full-width{justify-content:center;width:100%;display:flex}
