@layer bk.components{.btn{font:var(--bk-type-label);align-items:center;gap:var(--space-sm);text-transform:uppercase;letter-spacing:normal;padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-md);border:1px solid var(--bk-control-border);background:var(--bk-control-background);color:var(--bk-control-text);cursor:pointer;transition:background var(--motion-fast-duration) var(--motion-standard-easing), color var(--motion-fast-duration) var(--motion-standard-easing), border-color var(--motion-fast-duration) var(--motion-standard-easing);display:inline-flex}.btn:hover{background:var(--bk-control-hover-background);color:var(--bk-control-active-text);border-color:var(--bk-control-hover-border)}.btn:focus-visible{outline:var(--bk-focus-width) solid var(--bk-focus-ring);outline-offset:var(--bk-focus-offset)}.btn:active{box-shadow:none;transform:scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.btn svg{flex-shrink:0}.btn--primary{background:color-mix(in srgb, var(--accent) 12%, var(--surface));border-color:color-mix(in srgb, var(--accent) 40%, transparent);color:var(--bk-action-text)}.btn--primary:hover{background:color-mix(in srgb, var(--accent) 20%, var(--surface));border-color:var(--bk-action-text)}.btn--danger{border-color:var(--bk-control-hover-border);color:var(--bk-control-active-text)}.btn--danger:hover{border-color:var(--bk-control-active-text)}.btn--ghost{box-shadow:none;background:0 0;border-color:#0000}.btn--ghost:hover{background:var(--surface);border-color:var(--border);box-shadow:none}.btn--sm{padding:var(--space-xs) var(--space-sm)}.btn--lg{padding:var(--space-md) var(--space-xl);min-height:var(--target-touch-size)}.btn--icon{width:var(--target-touch-size);height:var(--target-touch-size);flex:none;justify-content:center;padding:0}.btn--case-none{text-transform:none;letter-spacing:normal}@container bk-screen (width<=68.75em){.btn{min-height:var(--target-touch-size);padding:var(--space-sm) var(--space-lg)}}@media (pointer:coarse){.btn{min-height:var(--target-touch-size);padding:var(--space-sm) var(--space-lg)}}@media (prefers-reduced-motion:reduce){:where(:root:not([data-prefers-reduced-motion=no-preference])) .btn:active{transform:none}}:where(:root[data-prefers-reduced-motion=reduce]) .btn:active{transform:none}}
