/* Button · the kit rules for this component, quoted from phase-2/kit (kit v3) by phase-4/src/build_pack.py.
   Tokens come from ../../styles.css. Build it as: Button. */
/* base.css */
.btn{font-family:var(--font-voice);font-stretch:var(--font-stretch-title);font-variation-settings:normal}
/* base.css */
.is-hover.btn-primary{background:hsl(var(--primary-hover))}
/* base.css */
.is-hover.btn-secondary{background:hsl(var(--muted));border-color:hsl(var(--secondary-border-hover))}
/* base.css */
.is-hover.btn-ghost, .is-hover.btn-tertiary{background:hsl(var(--muted))}
/* base.css */
.kit-m .btn{height:var(--control-h-m)}
/* base.css */
.kit-m .btn.sm{height:var(--control-h-m)}
/* base.css */
.kit-m .btn.lg{height:var(--control-h-m-lg);font-size:var(--text-btn-lg)}
/* base.css */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);height:var(--control-h);padding:0 var(--s-4);border-radius:var(--r-control);font-size:var(--text-btn);font-weight:var(--w-semibold);letter-spacing:-.003em;white-space:nowrap;border:1px solid transparent;text-decoration:none;transition:background-color var(--motion-hover),border-color var(--motion-hover),color var(--motion-hover),box-shadow var(--motion-focus),transform var(--motion-press),filter var(--motion-hover)}
/* base.css */
.btn:active{transform:translateY(var(--press-shift))}
/* base.css */
.btn.sm{height:var(--control-h-sm);padding:0 var(--s-3);font-size:var(--text-btn-sm)}
/* base.css */
.btn.lg{height:var(--control-h-m-lg);padding:0 var(--s-5);font-size:var(--text-btn-lg)}
/* base.css */
.btn-primary{background:hsl(var(--primary));color:hsl(var(--primary-foreground));box-shadow:var(--e-btn)}
/* base.css */
.btn-primary:hover{background:hsl(var(--primary-hover))}
/* base.css */
.btn-secondary{background:hsl(var(--secondary));color:hsl(var(--secondary-foreground));border-color:hsl(var(--secondary-border));box-shadow:var(--e-btn-2)}
/* base.css */
.btn-secondary:hover{background:hsl(var(--muted));border-color:hsl(var(--secondary-border-hover))}
/* base.css */
.btn-tertiary{background:transparent;color:hsl(var(--foreground));padding:0 var(--s-3)}
/* base.css */
.btn-tertiary:hover, .btn-ghost:hover{background:hsl(var(--muted))}
/* base.css */
.btn-ghost{background:transparent;color:hsl(var(--muted-foreground))}
/* base.css */
.btn-danger{background:hsl(var(--destructive));color:hsl(var(--destructive-foreground))}
/* base.css */
.btn-danger:hover{filter:brightness(.92)}
/* base.css */
.btn-danger-quiet{background:transparent;color:hsl(var(--destructive));border-color:hsl(var(--destructive)/.4)}
/* base.css */
.btn-danger-quiet:hover{background:hsl(var(--destructive)/.07)}
/* base.css */
.btn[disabled], .btn[aria-disabled=true]{opacity:.45;pointer-events:none;box-shadow:none}
/* base.css */
.btn[aria-busy=true]{pointer-events:none}
/* base.css */
.spin{width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;display:inline-block;animation:kit-spin var(--motion-spin) var(--ease-linear) infinite}
/* base.css */
@media (prefers-reduced-motion:reduce){.spin{animation-duration:var(--motion-spin-reduced)}}
/* base.css */
a.btn{text-decoration:none}
/* base.css */
a.btn.btn-primary, a.btn.btn-primary:hover{color:hsl(var(--primary-foreground))}
/* base.css */
a.btn.btn-danger, a.btn.btn-danger:hover{color:hsl(var(--destructive-foreground))}
/* families/form-controls/family.css */
.is-hover.btn-danger{filter:brightness(.92)}
/* families/form-controls/family.css */
.is-hover.btn-danger-quiet{background:hsl(var(--destructive)/.07)}