/* 登录页 · 新拟物（Neumorphism）主题 * * 由页面右下角小图标一键切换；class 挂在 上（login-neu）， * 避免首屏闪烁。只改视觉层，不改登录逻辑。 */ html.login-neu body { background: #e0e5ec; color: #3a4250; } /* 新拟物模式：移除登录页流动的彩色光晕与极光背景，只保留干净的浅灰底 */ html.login-neu .login-shell::before, html.login-neu .login-shell::after, html.login-neu .login-card::before, html.login-neu .login-card::after { display: none; animation: none; } html.login-neu .login-card { border: 0; border-radius: 30px; background: #e0e5ec; box-shadow: 12px 12px 26px #bec5d0, -12px -12px 26px #ffffff; } html.login-neu .login-brand { gap: 15px; } html.login-neu .login-brand-copy { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; } html.login-neu .login-brand-copy .eyebrow { margin: 0; color: #7b8794; } html.login-neu .login-style-toggle { display: grid; width: 27px; height: 27px; flex: 0 0 auto; place-items: center; border: 0; border-radius: 50%; background: #e0e5ec; color: #6d5dfc; cursor: pointer; box-shadow: 4px 4px 9px #bec5d0, -4px -4px 9px #ffffff; transition: box-shadow 0.18s ease, transform 0.18s ease; } html.login-neu .login-style-toggle svg { width: 15px; height: 15px; } html.login-neu .login-style-toggle:hover { color: #5b4be8; } html.login-neu .login-style-toggle:active { transform: scale(0.94); box-shadow: inset 3px 3px 6px #bec5d0, inset -3px -3px 6px #ffffff; } html.login-neu .login-card h1 { color: #3a4250; } html.login-neu .login-card .muted, html.login-neu .login-card .notice { color: #7b8794; } html.login-neu .stack label { color: #4a5568; font-weight: 650; } html.login-neu .stack input[type="email"], html.login-neu .stack input[type="password"], html.login-neu .stack input:not([type]) { border: 0; border-radius: 16px; background: #e0e5ec; color: #3a4250; box-shadow: inset 6px 6px 12px #bec5d0, inset -6px -6px 12px #ffffff; } html.login-neu .stack input::placeholder { color: #9aa5b1; } html.login-neu .stack input:focus { outline: none; box-shadow: inset 6px 6px 12px #bec5d0, inset -6px -6px 12px #ffffff, 0 0 0 2px rgba(109, 93, 252, 0.32); } html.login-neu .password-row .button-quiet { border: 0; border-radius: 12px; background: #e0e5ec; color: #6d5dfc; box-shadow: 4px 4px 9px #bec5d0, -4px -4px 9px #ffffff; } html.login-neu .login-card .button { border: 0; border-radius: 999px; background: #e0e5ec; color: #4a5568; box-shadow: 7px 7px 16px #bec5d0, -7px -7px 16px #ffffff; } html.login-neu .login-card .button-primary { background: linear-gradient(145deg, #8b7cff, #5b4be8); color: #fff; box-shadow: 8px 8px 18px #bec5d0, -8px -8px 18px #ffffff; } html.login-neu .login-card .button-passkey { background: #e0e5ec; color: #4a5568; box-shadow: 7px 7px 16px #bec5d0, -7px -7px 16px #ffffff; } html.login-neu .login-card .button-passkey > span { border: 0; background: #e0e5ec; color: #6d5dfc; box-shadow: 3px 3px 7px #bec5d0, -3px -3px 7px #ffffff; } html.login-neu .login-card .button-guest { background: #e0e5ec; color: #4a5568; box-shadow: 7px 7px 16px #bec5d0, -7px -7px 16px #ffffff; } html.login-neu .login-card .button-guest small { color: #7b8794; } html.login-neu .login-passkey-divider, html.login-neu .login-guest-entry > span { color: #9aa5b1; } html.login-neu .login-passkey-divider::before, html.login-neu .login-passkey-divider::after, html.login-neu .login-guest-entry > span::before, html.login-neu .login-guest-entry > span::after { background: #cfd6e0; } html.login-neu .login-passkey-entry > small, html.login-neu .login-guest-entry > p, html.login-neu .login-footnote { color: #9aa5b1; } html.login-neu .guest-visit-count { border: 0; border-radius: 18px; background: #e0e5ec; color: #4a5568; box-shadow: inset 5px 5px 10px #bec5d0, inset -5px -5px 10px #ffffff; } html.login-neu .guest-visit-count > span { color: #6d5dfc; } html.login-neu .guest-visit-count strong { color: #3a4250; } html.login-neu .login-card .brand-avatar-large, html.login-neu .login-card .brand-mark-large { box-shadow: 8px 8px 18px #bec5d0, -8px -8px 18px #ffffff; } /* 深色模式 */ @media (prefers-color-scheme: dark) { html.login-neu body { background: #23262d; color: #e8ecf2; } html.login-neu .login-card, html.login-neu .login-style-toggle, html.login-neu .login-card .button, html.login-neu .login-card .button-passkey, html.login-neu .login-card .button-guest, html.login-neu .login-card .button-passkey > span, html.login-neu .login-card .brand-avatar-large, html.login-neu .login-card .brand-mark-large { background: #23262d; box-shadow: 8px 8px 18px #171a1f, -8px -8px 18px #30353e; } html.login-neu .stack input[type="email"], html.login-neu .stack input[type="password"], html.login-neu .stack input:not([type]) { background: #23262d; color: #e8ecf2; box-shadow: inset 6px 6px 12px #171a1f, inset -6px -6px 12px #30353e; } html.login-neu .guest-visit-count { background: #23262d; box-shadow: inset 5px 5px 10px #171a1f, inset -5px -5px 10px #30353e; } html.login-neu .login-card h1, html.login-neu .stack label { color: #e8ecf2; } html.login-neu .login-card .button-primary { background: linear-gradient(145deg, #8b7cff, #5b4be8); color: #fff; } } /* 减弱动态：关闭按压位移 */ @media (prefers-reduced-motion: reduce) { html.login-neu .login-style-toggle { transition: none; } html.login-neu .login-style-toggle:active { transform: none; } }