.page-loader {
            position: fixed;
            inset: 0;
            z-index: 9999;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 24px;
            background: rgba(236, 239, 241, 0.58);
            backdrop-filter: blur(3px);
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.18s ease, visibility 0.18s ease;
        }

        .page-loader.visible {
            opacity: 1;
            visibility: visible;
            pointer-events: all;
        }

        .page-loader-card {
            min-width: 220px;
            display: grid;
            justify-items: center;
            gap: 12px;
            padding: 18px 22px;
            border: 1px solid rgba(47, 59, 67, 0.12);
            background: rgba(255, 255, 255, 0.94);
            box-shadow: 0 16px 40px rgba(32, 51, 61, 0.12);
            color: #2f3b43;
            text-align: center;
        }

        .page-loader-spinner {
            width: 36px;
            height: 36px;
            border-radius: 999px;
            border: 3px solid rgba(85, 105, 114, 0.22);
            border-top-color: #556972;
            animation: page-loader-spin 0.85s linear infinite;
        }

        .page-loader-text {
            font-size: 13px;
            font-weight: 600;
            letter-spacing: 0.02em;
        }

        body.page-loading {
            cursor: progress;
        }

        @keyframes page-loader-spin {
            from {
                transform: rotate(0deg);
            }

            to {
                transform: rotate(360deg);
            }
        }