:root {
            --aidion-bg-start: #eef0f4;
            --aidion-bg-end: #e2e6ec;
            --aidion-card: #ffffff;
            --aidion-text: #1a1d23;
            --aidion-text-muted: #5c6370;
            --aidion-text-hint: #9ca3af;
            --aidion-accent: #1e293b;
            --aidion-accent-hover: #0f172a;
            --aidion-badge-bg: #f1f3f7;
            --aidion-badge-text: #374151;
            --aidion-border: #e5e7eb;
            --aidion-icon: #334155;
            --aidion-shadow: rgba(15, 23, 42, 0.07);
        }

        *, *::before, *::after {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
            color: var(--aidion-text);
            /* Тонкий диагональный градиент вместо плоского фона */
            background:
                linear-gradient(160deg, var(--aidion-bg-start) 0%, var(--aidion-bg-end) 100%);
            /* Тонкая сетка-паттерн для глубины */
            background-image:
                linear-gradient(160deg, var(--aidion-bg-start) 0%, var(--aidion-bg-end) 100%),
                radial-gradient(circle at 20% 80%, rgba(30,41,59,0.03) 0%, transparent 50%),
                radial-gradient(circle at 80% 20%, rgba(30,41,59,0.025) 0%, transparent 50%);
            background-attachment: fixed;
        }

        /* Карточка */
        .auth-card {
            background: var(--aidion-card);
            border: 1px solid var(--aidion-border);
            border-radius: 1rem;
            box-shadow:
                0 4px 6px -1px var(--aidion-shadow),
                0 16px 40px -4px var(--aidion-shadow),
                0 0 0 0px transparent;
            padding: 3rem 2.5rem 2.5rem;
            max-width: 480px;
            width: 100%;
            text-align: center;
            margin: 1rem;
            /* Появление */
            animation: cardIn 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
        }

        @keyframes cardIn {
            from {
                opacity: 0;
                transform: translateY(12px) scale(0.98);
            }
            to {
                opacity: 1;
                transform: translateY(0) scale(1);
            }
        }

        /* Иконка */
        .logo-mark {
            width: 64px;
            height: 64px;
            border-radius: 0.875rem;
            background: var(--aidion-accent);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 1.5rem;
            color: #ffffff;
            font-size: 1.75rem;
            transition: transform 0.2s ease, box-shadow 0.2s ease;
        }

        .logo-mark:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 16px rgba(30, 41, 59, 0.25);
        }

        /* Заголовок */
        .auth-card h1 {
            font-size: 1.75rem;
            font-weight: 700;
            letter-spacing: -0.4px;
            margin: 0 0 0.75rem;
            color: var(--aidion-text);
        }

        /* Бейдж */
        .badge-role {
            display: inline-flex;
            align-items: center;
            gap: 0.375rem;
            background: var(--aidion-badge-bg);
            color: var(--aidion-badge-text);
            font-size: 0.8125rem;
            font-weight: 500;
            padding: 0.3rem 0.85rem;
            border-radius: 999px;
            border: 1px solid var(--aidion-border);
            margin-bottom: 1.25rem;
        }

        .badge-role i {
            font-size: 0.75rem;
            opacity: 0.7;
        }

        /* Описание */
        .auth-desc {
            color: var(--aidion-text-muted);
            font-size: 0.9375rem;
            line-height: 1.55;
            margin: 0 0 2rem;
            max-width: 360px;
            margin-left: auto;
            margin-right: auto;
        }

        /* Кнопка */
        .btn-enter {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            width: 100%;
            padding: 0.8rem 1.5rem;
            font-size: 1rem;
            font-weight: 600;
            border-radius: 0.625rem;
            border: none;
            background: var(--aidion-accent);
            color: #ffffff;
            text-decoration: none;
            transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
            cursor: pointer;
        }

        .btn-enter:hover {
            background: var(--aidion-accent-hover);
            color: #ffffff;
            transform: translateY(-1px);
            box-shadow: 0 4px 14px rgba(15, 23, 42, 0.3);
            text-decoration: none;
        }

        .btn-enter:active {
            transform: translateY(0);
            box-shadow: 0 2px 6px rgba(15, 23, 42, 0.2);
        }

        .btn-enter:focus-visible {
            outline: 2px solid var(--aidion-accent);
            outline-offset: 2px;
        }

        .btn-enter i {
            font-size: 1.125rem;
        }

        /* Подсказка */
        .hint-block {
            margin-top: 1.75rem;
            padding-top: 1.25rem;
            border-top: 1px solid var(--aidion-border);
        }

        .hint-block .hint-label {
            font-size: 0.6875rem;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            color: var(--aidion-text-hint);
            font-weight: 600;
            margin-bottom: 0.5rem;
        }

        .hint-block code {
            font-size: 0.8125rem;
            color: var(--aidion-text-muted);
            background: var(--aidion-badge-bg);
            padding: 0.15rem 0.4rem;
            border-radius: 4px;
            font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
        }

        .hint-block .hint-sub {
            font-size: 0.75rem;
            color: var(--aidion-text-hint);
            margin-top: 0.35rem;
        }

        .invert-image {
            filter: invert(100%);
        }

        /* Или 50% инверсии */
        .invert-image-50 {
            filter: invert(50%);
        }

        /* С интерактивом при наведении */
        .invert-hover:hover {
            filter: invert(100%);
            transition: filter 0.3s ease;
        }

        /* Адаптивность */
        @media (max-width: 576px) {
            .auth-card {
                padding: 2rem 1.5rem 1.75rem;
            }
            .auth-card h1 {
                font-size: 1.5rem;
            }
        }

        /* Уважаем prefers-reduced-motion */
        @media (prefers-reduced-motion: reduce) {
            .auth-card {
                animation: none;
            }
            .logo-mark:hover {
                transform: none;
            }
            .btn-enter:hover {
                transform: none;
            }
        }