        [v-cloak] {
            display: none !important;
        }

        /* 密码管理器自动填充检测：通过 animationstart 事件同步 Vue reactive 状态 */
        @keyframes loginAutofillDetect {
            from {
                opacity: 1;
            }

            to {
                opacity: 1;
            }
        }

        input:-webkit-autofill {
            animation-name: loginAutofillDetect;
            animation-duration: 0.001s;
        }

        .header {
            background: #fff;
            position: sticky;
            top: 0;
            z-index: 50;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
        }

        .animate-slide-up {
            animation: slide-up 0.4s cubic-bezier(0.16, 1, 0.3, 1);
        }

        .animate-fade-in {
            animation: fade-in 0.2s ease-out;
        }

        .animate-header-search-in {
            animation: header-search-in 0.16s ease-out;
        }

        @keyframes slide-up {
            from {
                transform: translateY(20px);
                opacity: 0;
            }

            to {
                transform: translateY(0);
                opacity: 1;
            }
        }

        @keyframes fade-in {
            from {
                opacity: 0;
                transform: scale(0.95);
            }

            to {
                opacity: 1;
                transform: scale(1);
            }
        }

        @keyframes header-search-in {
            from {
                opacity: 0;
            }

            to {
                opacity: 1;
            }
        }

        .spinner {
            width: 30px;
            height: 30px;
            border: 3px solid #f3f3f3;
            border-top: 3px solid #10b981;
            border-radius: 50%;
            animation: spin 1s linear infinite;
        }

        @keyframes spin {
            0% {
                transform: rotate(0deg);
            }

            100% {
                transform: rotate(360deg);
            }
        }

        /* 排序相关样式 */
        .sortable-ghost {
            opacity: 0.35;
            background: #f8fafc;
            border: 2px dashed #cbd5e1;
            border-radius: 1rem;
        }

        .sortable-fallback {
            opacity: 1 !important;
            background: #fff;
            transform: scale(1.02) rotate(0.8deg);
            box-shadow: 0 16px 30px -14px rgba(15, 23, 42, 0.38);
            border: 1px solid rgba(148, 163, 184, 0.35);
            border-radius: 1rem;
            z-index: 9999 !important;
            pointer-events: none;
            cursor: grabbing;
        }

        .sortable-chosen {
            transform: scale(1.01);
            box-shadow: 0 10px 20px -14px rgba(15, 23, 42, 0.35);
        }

        .sortable-drag {
            cursor: grabbing;
            opacity: 0.15;
        }
