   <style>
        /* ===== 随机背景图 + 淡入动画 ===== */
        body, html {
            margin: 0;
            padding: 0;
            height: 100%;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
            overflow: hidden;
            color: white;
        }

        /* 背景容器 */
        #bg-container {
            position: fixed;
            top: 0; left: 0;
            width: 100%; height: 100%;
            background-image: url('<?= $random_bg ?>');
            background-size: cover;
            background-position: center;
            transition: opacity 1.2s ease-in-out;
            z-index: -2;
        }

        /* 黑色半透明遮罩 */
        #overlay {
            position: fixed;
            top: 0; left: 0;
            width: 100%; height: 100%;
            background: rgba(0, 0, 0, 0.5);
            z-index: -1;
        }

        /* 登录卡片 */
        .container {
            max-width: 400px;
            width: 90%;
            margin: 60px auto;
            padding: 40px 50px;
            backdrop-filter: blur(10px);
            background: rgba(255, 255, 255, 0.2);
            border-radius: 16px;
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
            border: 1px solid rgba(255, 255, 255, 0.3);
            text-align: center;
            animation: fadeIn 0.6s ease forwards;
            position: relative;
            z-index: 10;
        }

        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(20px); }
            to   { opacity: 1; transform: translateY(0); }
        }

        h1 {
            font-size: 24px;
            margin-bottom: 20px;
            color: white;
        }

        .form-row {
            display: flex;
            align-items: center;
            margin: 15px 0;
            flex-wrap: nowrap;
        }

        .form-label {
            width: 80px;
            text-align: right;
            padding-right: 12px;
            font-size: 15px;
            color: rgba(255, 255, 255, 0.9);
            white-space: nowrap;
        }

        input[type="text"],
        input[type="password"] {
            flex: 1;
            padding: 12px 15px;
            border: none;
            border-radius: 8px;
            background: rgba(0, 0, 0, 0.3);
            color: white;
            font-size: 16px;
            outline: none;
        }

        input::placeholder {
            color: rgba(255, 255, 255, 0.6);
        }

        input:focus {
            background: rgba(0, 0, 0, 0.4);
            box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.3);
        }
/* ===== 修复 Chrome 自动填充背景 ===== */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-text-fill-color: white !important;
    -webkit-box-shadow: 0 0 0px 1000px rgba(0, 0, 0, 0.3) inset !important;
    box-shadow: 0 0 0px 1000px rgba(0, 0, 0, 0.3) inset !important;
    background: rgba(0, 0, 0, 0.3) !important;
    background-color: rgba(0, 0, 0, 0.3) !important;
    transition: background-color 5000s ease-in-out 0s !important;
    border: none;
}

/* 取消自动填充后的闪烁动画 */
@keyframes autofill-fix {
    to {
        background: rgba(0, 0, 0, 0.3);
    }
}


/* 聚焦时效果 */
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus {
    background: rgba(0, 0, 0, 0.4);
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.4);
    transform: translateY(-1px);
}


        .submit-row {
            text-align: center;
            margin-top: 25px;
        }

        .btn {
            display: inline-block;
            padding: 12px 24px;
            background: rgba(255, 255, 255, 0.2);
            color: white;
            text-decoration: none;
            border-radius: 8px;
            font-weight: 500;
            border: 1px solid rgba(255, 255, 255, 0.4);
            transition: all 0.3s;
        }

        .btn:hover {
            background: rgba(255, 255, 255, 0.35);
            transform: translateY(-2px);
        }

        .link {
            color: rgba(255, 255, 255, 0.8);
            text-decoration: none;
            font-size: 14px;
            margin-top: 20px;
            display: block;
        }

        .link:hover {
            text-decoration: underline;
        }

        .error {
            background: rgba(255, 0, 0, 0.2);
            color: #ffcccc;
            padding: 12px;
            border-radius: 8px;
            margin: 10px 0;
            border: 1px solid rgba(255, 0, 0, 0.3);
        }
    </style>