@layer theme,base;@layer components{.ui-btn{--btn-h:var(--control-h);justify-content:center;align-items:center;gap:var(--space-2);min-height:var(--btn-h);border-radius:var(--radius-pill);background:var(--bg-sunken);color:var(--text-strong);font:600 var(--type-md) / 1 var(--font-ui);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;transition:background-color var(--dur-1) var(--ease-standard), transform var(--dur-1) var(--ease-standard);border:0;flex:none;padding:0 18px;text-decoration:none;display:inline-flex;position:relative}.ui-btn:hover{background:var(--bg-sunken-hover)}.ui-btn:active:not(:disabled,[aria-disabled=true]){transform:scale(.97)}.ui-btn:focus-visible{outline:2px solid var(--ring-focus);outline-offset:2px}.ui-btn[data-variant=primary]{background:var(--brand);color:var(--text-on-brand)}.ui-btn[data-variant=primary]:hover{background:var(--brand-hover)}.ui-btn[data-variant=accent]{background:var(--accent);color:var(--text-on-accent)}.ui-btn[data-variant=accent]:hover{background:var(--accent-hover)}.ui-btn[data-variant=ghost]{color:var(--text);background:0 0}.ui-btn[data-variant=ghost]:hover{background:var(--bg-hover)}.ui-btn[data-variant=ghost]:active{background:var(--bg-pressed)}.ui-btn[data-variant=danger]{background:var(--danger);color:var(--text-on-brand)}.ui-btn[data-variant=danger]:hover{background:var(--danger-hover)}.ui-btn[data-size=sm]{--btn-h:var(--control-h-sm);font-size:var(--type-sm);padding:0 14px}.ui-btn[data-size=lg]{--btn-h:var(--control-h-lg);font-size:var(--type-lg);padding:0 24px}.ui-btn[data-icon=true]{width:var(--btn-h);padding:0}.ui-btn[data-block=true]{width:100%}.ui-btn:disabled{cursor:not-allowed;opacity:.45}.ui-btn[aria-busy=true]{color:#0000;cursor:progress}.ui-btn[aria-busy=true]:after{content:"";border:2px solid var(--bg-pressed);border-top-color:var(--text-strong);border-radius:50%;width:18px;height:18px;margin:auto;position:absolute;inset:0}.ui-btn:is([data-variant=primary],[data-variant=danger])[aria-busy=true]:after{border-color:#ffffff59;border-top-color:var(--text-on-brand)}@media (prefers-reduced-motion:no-preference){.ui-btn[aria-busy=true]:after{animation:.7s linear infinite ui-spin}}@media (prefers-reduced-motion:reduce){.ui-btn{transition:none}.ui-btn:active:not(:disabled){transform:none}}}@layer utilities;@keyframes ui-spin{to{transform:rotate(360deg)}}