@layer components{html[data-theme=spectrum] .btn{isolation:isolate;font-family:var(--font-sans);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform var(--dur-fast) var(--ease-out-expo), color var(--dur-base) var(--ease-out-expo), background-color var(--dur-base) var(--ease-out-expo), border-color var(--dur-base) var(--ease-out-expo), box-shadow var(--dur-base) var(--ease-out-expo);border-radius:14px;justify-content:center;align-items:center;gap:.5rem;font-weight:600;text-decoration:none;display:inline-flex;position:relative}html[data-theme=spectrum] .btn:active:not(:disabled){transform:translateY(1px)}html[data-theme=spectrum] .btn:disabled,html[data-theme=spectrum] .btn[aria-disabled=true]{opacity:.5;pointer-events:none}html[data-theme=spectrum] .btn-primary{color:#fff;background:var(--oc-sky-700);border:1px solid #0000;overflow:hidden;box-shadow:0 10px 24px -10px #0369a199}html[data-theme=spectrum] .btn-primary:after{content:"";opacity:0;z-index:1;pointer-events:none;background:linear-gradient(100deg,#0000,#ffffff59,#0000);width:40%;position:absolute;top:0;bottom:0;left:-40%;transform:skew(-18deg)translate(-120%)}html[data-theme=spectrum] .btn-primary:hover,html[data-theme=spectrum] .btn-primary:focus-visible{color:#fff;background:var(--oc-sky-800);box-shadow:0 14px 30px -10px #0369a1b3}html[data-theme=spectrum] .btn-primary:hover{transform:translateY(-1px)}html[data-theme=spectrum] .btn-primary:hover:after{opacity:1;animation:sp-btn-sweep .7s var(--ease-out-expo) forwards}html[data-theme=spectrum] .btn-primary:focus-visible{box-shadow:0 0 0 2px #fff, 0 0 0 4px var(--sp-signal)}html[data-theme=spectrum] .btn-secondary{color:var(--sp-text-1);border:1px solid var(--oc-line-2);background:#fff;box-shadow:0 1px 2px #0b1b2b0d}html[data-theme=spectrum] .btn-secondary:hover,html[data-theme=spectrum] .btn-secondary:focus-visible{background:var(--oc-sky-50);border-color:var(--oc-sky-200)}html[data-theme=spectrum] .btn-secondary:focus-visible{box-shadow:0 0 0 2px #fff, 0 0 0 4px var(--sp-signal)}html[data-theme=spectrum] .btn-ghost{color:var(--sp-text-2);background:0 0;border:1px solid #0000}html[data-theme=spectrum] .btn-ghost:hover,html[data-theme=spectrum] .btn-ghost:focus-visible{color:var(--sp-text-1);background:var(--oc-sky-50)}html[data-theme=spectrum] .btn-ghost:focus-visible{box-shadow:0 0 0 2px #fff, 0 0 0 4px var(--sp-signal)}html[data-theme=spectrum] .btn-link{color:var(--sp-signal);text-underline-offset:.3em;background:0 0;border:0;border-radius:4px;height:auto;padding:0;text-decoration-thickness:1px}html[data-theme=spectrum] .btn-link:hover{text-decoration:underline}html[data-theme=spectrum] .btn-sm{border-radius:12px;height:2.5rem;padding-inline:1rem;font-size:.875rem}html[data-theme=spectrum] .btn-md{height:3rem;padding-inline:1.375rem;font-size:.9375rem}html[data-theme=spectrum] .btn-lg{height:3.25rem;padding-inline:1.625rem;font-size:1rem}html[data-theme=spectrum] .btn-xl{border-radius:16px;height:3.5rem;padding-inline:2rem;font-size:1.0625rem}html[data-theme=spectrum] .btn-icon{border-radius:12px;width:2.75rem;height:2.75rem;padding:0}html[data-theme=spectrum] .btn svg{flex-shrink:0;width:1.1em;height:1.1em}html[data-theme=spectrum] .btn[data-loading=true]{pointer-events:none}html[data-theme=spectrum] .btn[data-loading=true]>.btn-label{opacity:.35}html[data-theme=spectrum] .btn-spinner{place-items:center;display:grid;position:absolute;inset:0}html[data-theme=spectrum] .btn-spinner>span{border:2px solid;border-right-color:#0000;border-radius:50%;width:1.1em;height:1.1em;animation:.8s linear infinite sp-spin}}@keyframes sp-btn-sweep{to{transform:skew(-18deg)translate(400%)}}@keyframes sp-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){html[data-theme=spectrum] .btn-primary:after{animation:none!important}}html[data-theme=spectrum][data-reduce-motion=true] .btn-primary:after{animation:none!important}
