:root{--bg: #f4f4f4;--card-bg: #ffffff;--text: #262626;--text-muted: #666;--border: #d9d9d9;--accent: #f59e0b;--accent-deep: #d97706;--accent-soft: rgba(245, 158, 11, .15);--focus-ring: rgba(245, 158, 11, .25);--radius: 8px}body{height:100%;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,PingFang SC,Microsoft YaHei,sans-serif;background-size:cover;background-position:center;background-repeat:no-repeat;background-color:var(--bg);background-attachment:fixed}.login-page{display:flex;justify-content:center;align-items:center;height:100vh;box-sizing:border-box;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);animation:fadeIn .4s ease-in}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.login-card{position:relative;overflow:hidden;max-width:395px;width:100%;margin:50px auto;padding:20px;background:var(--card-bg);box-shadow:0 8px 30px #0000001f;border-radius:var(--radius);animation:slideUp .5s ease-out;will-change:transform,opacity}.brand-header{text-align:center;margin-bottom:24px;animation:slideUp .5s ease-out}.brand-logo{width:56px;height:56px;border-radius:50%;object-fit:cover;margin-bottom:12px}.brand-site-name{font-size:22px;font-weight:600;color:var(--text);letter-spacing:.5px}.brand-login-title{font-size:28px;font-weight:600;color:var(--text);margin-top:8px}.brand-login-subtitle{font-size:14px;color:var(--text-muted);margin-top:6px}.brand-footer{text-align:center;font-size:12px;color:var(--text-muted);margin-top:20px;padding-top:14px;border-top:1px solid var(--border)}@media (max-width: 768px){.login-card{margin:20px;max-width:calc(100% - 40px)}}@media (max-width: 480px){.login-card{margin:16px;max-width:calc(100% - 32px);padding:16px}}.login-card .ant-form-item{margin-bottom:20px;overflow:hidden}.login-card .ant-btn{border-radius:30px;transition:all .3s ease}.login-card .ant-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.login-card .ant-btn:active{transform:translateY(0)}.login-card .ant-input,.login-card .ant-input-password{transition:all .3s ease}.login-card .ant-input:focus,.login-card .ant-input-password:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--focus-ring)}@media (prefers-reduced-motion: reduce){.login-page,.login-card,.brand-header,.oauth-container{animation:none}.login-card .ant-btn,.login-card .ant-input,.login-card .ant-input-password{transition:none}}.content{min-height:120px;display:flex;align-items:center;justify-content:center}.oauth-container{margin-top:24px;width:100%}.oauth-divider{display:flex;align-items:center;margin-bottom:20px;gap:12px}.divider-line{flex:1;height:1px;background:linear-gradient(to right,transparent,var(--border),transparent)}.divider-text{font-size:13px;color:var(--text-muted);white-space:nowrap;padding:0 4px}.oauth-buttons{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;padding:8px 0}.oauth-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--border);background:var(--card-bg);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;font-size:20px;padding:0;box-shadow:0 2px 4px #00000014}.oauth-btn:not(.oauth-btn-disabled):hover{transform:translateY(-3px);box-shadow:0 6px 16px #0000001f;border-color:transparent}.oauth-btn:not(.oauth-btn-disabled):active{transform:translateY(-1px);box-shadow:0 4px 8px #0000001a}.oauth-btn-github{color:#24292e}.oauth-btn-github:not(.oauth-btn-disabled):hover{background:#24292e;color:#fff}.oauth-btn-passkey{color:#722ed1}.oauth-btn-passkey:not(.oauth-btn-disabled):hover{background:#722ed1;color:#fff}.oauth-btn-totp{color:#fa8c16}.oauth-btn-totp:not(.oauth-btn-disabled):hover{background:#fa8c16;color:#fff}.oauth-btn-disabled{opacity:.4;cursor:not-allowed}.oauth-btn-disabled:hover{transform:none!important;box-shadow:0 2px 4px #00000014!important;border-color:var(--border)!important;background:var(--card-bg)!important}@media (max-width: 480px){.oauth-btn{width:40px;height:40px;font-size:18px}.oauth-buttons{gap:12px}.divider-text{font-size:12px}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.oauth-container{animation:fadeInUp .5s ease-out .2s both}@media (prefers-reduced-motion: reduce){.oauth-container{animation:none}}
