:root {
            color-scheme: light;
            font-family: Inter, "Microsoft YaHei", Arial, sans-serif;
            background: #fff;
            color: #111;
        }
        * { box-sizing: border-box; }
        body {
            margin: 0;
            min-height: 100vh;
            display: grid;
            place-items: center;
            background: #fff;
        }
        .login-shell {
            width: min(430px, calc(100vw - 28px));
            min-height: 560px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 28px 18px;
        }
        .brand {
            margin: 0 0 28px;
            font-size: 34px;
            line-height: 1;
            font-weight: 900;
            letter-spacing: 0;
        }
        .brand::before { content: "「"; }
        .brand::after { content: "」"; }
        .wechat-login-heading {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            margin: 0 0 24px;
            font-size: 1.18rem;
            font-weight: 700;
            letter-spacing: 0;
        }
        .wechat-logo {
            width: 30px;
            height: 30px;
            border-radius: 8px;
            background: #07c160;
            color: #fff;
            padding: 5px;
            flex: 0 0 auto;
        }
        .qr-wrap {
            position: relative;
            width: 320px;
            max-width: 100%;
            min-height: 390px;
            display: grid;
            place-items: center;
            margin: 0 auto 8px;
        }
        .qr-expired .qr-content {
            filter: blur(5px);
            opacity: 0.42;
            pointer-events: none;
        }
        .qr-refresh-mask {
            position: absolute;
            inset: 0;
            display: none;
            align-items: center;
            justify-content: center;
            z-index: 2;
        }
        .qr-expired .qr-refresh-mask { display: flex; }
        .refresh-btn {
            width: 78px;
            height: 78px;
            border: 0;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.88);
            color: #555;
            box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
            display: inline-grid;
            place-items: center;
            cursor: pointer;
        }
        .refresh-btn:hover {
            color: #111;
            background: #fff;
        }
        .refresh-btn svg {
            width: 38px;
            height: 38px;
        }
        .status {
            color: #555;
            font-size: 0.92rem;
            line-height: 1.6;
            text-align: center;
        }
        .legal {
            max-width: 360px;
            margin: 18px auto 0;
            color: #777;
            font-size: 0.78rem;
            line-height: 1.7;
            text-align: center;
        }
        .legal a {
            color: #111;
            text-decoration: underline;
            text-underline-offset: 3px;
        }
        [hidden] { display: none !important; }
        #wechatQrContainer { width: 100%; min-height: 390px; }
        #wechatQrContainer iframe { width: 100%; max-width: 320px; }
        .qr-content { width: 100%; text-align: center; overflow-wrap: anywhere; }
        .login-btn, .decline-btn { width: 100%; min-height: 44px; padding: 12px 16px; border-radius: 6px; font: inherit; cursor: pointer; }
        .login-btn { background: #07a854; color: #fff; border: 1px solid #07a854; }
        .login-btn:disabled { opacity: 0.45; cursor: default; }
        .decline-btn { margin-top: 10px; color: #444; background: #fff; border: 1px solid #bbb; }
        dialog { width: min(460px, calc(100% - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 24px; border: 1px solid #ddd; border-radius: 8px; }
        dialog::backdrop { background: rgba(0, 0, 0, 0.45); }
        dialog h2 { margin: 0 0 16px; font-size: 21px; line-height: 1.4; }
        dialog p { font-size: 14px; line-height: 1.75; overflow-wrap: anywhere; }
        .policy-links { display: flex; flex-wrap: wrap; gap: 16px; }
        .policy-links a { color: #166344; text-underline-offset: 3px; }
        .consent-choice { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.75; }
        .consent-choice input { margin: 5px 0 0; flex: 0 0 auto; accent-color: #07a854; }
        .consent-choice { margin: 12px 0; }
        dialog h3 { font-size: 15px; margin: 18px 0 8px; }
        .age-choice { border: 0; padding: 0; margin: 16px 0 0; min-width: 0; }
        .age-choice legend { font-size: 14px; font-weight: 700; }
        #ageStatus { color: #b3261e; text-align: left; }