@scope([data-example]){[data-slot=file-input]{align-items:flex-start;gap:var(--space-3);flex-direction:column;width:20rem;min-width:0;max-width:100%;display:flex}[data-slot=file-input-dropzone]{align-self:stretch;align-items:center;gap:var(--space-1);min-width:0;padding:var(--space-8) var(--space-6);border-radius:var(--radius-surface);background:var(--surface-1);box-shadow:inset 0 0 0 1px var(--line);text-align:center;transition:background-color var(--duration), box-shadow var(--duration);flex-direction:column;display:flex}[data-slot=file-input-dropzone]>svg{width:24px;height:24px;margin-bottom:var(--space-2);color:var(--muted)}[data-slot=file-input-dropzone]>p:not([data-slot]){font-weight:500}[data-slot=file-input-dropzone]>p+p{margin-top:0}[data-slot=file-input-dropzone]>[data-slot=file-input-trigger]{margin-top:var(--space-3)}[data-slot=file-input-dropzone][data-dragging]{background:var(--tint);box-shadow:inset 0 0 0 1px var(--ink)}[data-slot=file-input-dropzone][data-drag-reject]{background:color-mix(in oklab, var(--danger) 9%, var(--surface-2));box-shadow:inset 0 0 0 1px var(--danger);color:var(--danger)}[data-slot=file-input-dropzone][data-drag-reject]>svg{color:inherit}[data-slot=file-input-dropzone][data-disabled]{box-shadow:inset 0 0 0 1px var(--line-faint);color:var(--line-disabled)}[data-slot=file-input-dropzone][data-disabled]>svg{color:inherit}[data-slot=file-input-dropzone][data-variant=overlay]{z-index:50;padding:0 0 var(--space-8);box-shadow:inset 0 0 0 2px var(--ink);pointer-events:none;background:0 0;border-radius:0;place-content:end center;display:none;position:fixed;inset:0}[data-slot=file-input-dropzone][data-variant=overlay][data-dragging]{display:grid}[data-slot=file-input-dropzone][data-variant=overlay]>[data-slot=stack]{align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-radius:var(--radius-popup);background:var(--surface-3);box-shadow:var(--shadow-3);flex-direction:row;font-weight:500}:scope[data-example=file-input\/page] [data-slot=file-input]>[data-slot=row]{justify-content:center;gap:var(--space-3);flex-wrap:nowrap}[data-slot=file-input-list]{border-radius:var(--radius-surface);background:var(--surface-1);box-shadow:var(--shadow-1);font-size:var(--text-sm);flex-direction:column;align-self:stretch;gap:1px;padding:5px;display:flex}[data-slot=file-input-list]:not(:has([data-slot=file-input-item])){display:none}[data-slot=file-input-item]{align-items:center;gap:var(--space-2);border-radius:var(--radius-row);min-width:0;min-height:32px;padding-inline:10px 4px;display:flex}[data-slot=file-input-item]:focus-visible{outline-offset:-3px;background:var(--tint)}[data-slot=file-input-item]>svg{color:var(--muted);flex-shrink:0}[data-slot=file-input-item]>span:not([data-slot]){text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}[data-slot=file-input-item]>[data-slot=hint]{font-size:var(--text-xs);font-variant-numeric:tabular-nums;flex-shrink:0}[data-slot=file-input-item-remove]{border-radius:calc(var(--radius-control) - 2px);width:24px;height:24px;color:var(--muted);background:0 0;border:0;flex-shrink:0;place-items:center;padding:0;transition:background-color .12s,color .12s;display:inline-grid}[data-slot=file-input-item-remove]:hover:not([data-disabled]){background:var(--tint);color:var(--ink)}[data-slot=file-input-item-remove][data-disabled]{visibility:hidden}}