/* ============================================================
   X1 · 登录页样式
   ============================================================ */

.x1-login { position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center; overflow: hidden; background: var(--x1-bg-0); padding: 40px 20px; }
.x1-login-main { margin-left: 0 !important; }

/* 背景装饰 */
.x1-login-bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.x1-login-bg .orb { position: absolute; border-radius: 50%; filter: blur(60px); opacity: 0.35; }
.x1-login-bg .orb-1 { width: 480px; height: 480px; top: -120px; right: -80px; background: radial-gradient(circle, var(--x1-primary), transparent 70%); }
.x1-login-bg .orb-2 { width: 420px; height: 420px; bottom: -140px; left: -100px; background: radial-gradient(circle, #13407a, transparent 70%); opacity: 0.5; }
.grid-lines { position: absolute; inset: 0; background-image: linear-gradient(rgba(86,120,180,0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(86,120,180,0.06) 1px, transparent 1px); background-size: 48px 48px; }

.x1-login-inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1.2fr 1fr; gap: 60px; max-width: 1080px; width: 100%; align-items: center; }

/* 左侧 */
.x1-login-hero { color: var(--x1-text-1); }
.x1-login-title { font-size: 44px; line-height: 1.15; font-weight: 700; letter-spacing: -0.01em; margin: 28px 0 18px; background: linear-gradient(135deg, #fff 30%, #9cc3ff 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.x1-login-sub { font-size: 16px; color: var(--x1-text-2); line-height: 1.8; }
.x1-login-tags { margin-top: 24px; display: flex; gap: 8px; flex-wrap: wrap; }

/* 右侧卡片 */
.x1-login-card-wrap { display: flex; justify-content: flex-end; }
.x1-login-card { width: 100%; max-width: 420px; padding: 28px; box-shadow: var(--x1-shadow-3); background: rgba(15,22,38,0.85); }
.x1-login-card-head h2 { font-size: 22px; font-weight: 700; }
.x1-login-card-head p { font-size: 12px; color: var(--x1-text-3); letter-spacing: 0.1em; text-transform: uppercase; margin-top: 2px; }

.x1-login-secure { display: flex; align-items: center; gap: 8px; margin: 18px 0; padding: 10px 12px; background: rgba(22,199,132,0.06); border: 1px solid rgba(22,199,132,0.2); border-radius: 10px; font-size: 12px; color: var(--x1-text-2); }
.x1-login-secure .x1-icon-check { color: var(--x1-up); flex-shrink: 0; }

.x1-wallet-list { display: flex; flex-direction: column; gap: 10px; }
.x1-wallet-row { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 12px; background: var(--x1-bg-2); border: 1px solid var(--x1-border-soft); cursor: pointer; transition: all var(--x1-speed) var(--x1-ease); }
.x1-wallet-row:hover { border-color: var(--x1-primary); background: var(--x1-primary-soft); box-shadow: var(--x1-glow-primary); transform: translateY(-1px); }
.x1-wallet-row--busy { opacity: 0.6; pointer-events: none; }
.wl-logo { width: 34px; height: 34px; border-radius: 10px; display: flex; align-items: center; justify-content: center; color: #000; font-weight: 700; flex-shrink: 0; }
.wl-logo span { font-size: 16px; }
.x1-wallet-row-name { flex: 1; font-size: 15px; font-weight: 600; }
.x1-wallet-conn { font-size: 12px; color: var(--x1-text-3); }

.x1-login-tos { margin-top: 18px; font-size: 11px; color: var(--x1-text-3); text-align: center; }
.x1-login-tos a { color: var(--x1-link); }

/* ============ 响应式 ============ */
@media (max-width: 900px) {
  .x1-login-inner { grid-template-columns: 1fr; gap: 36px; }
  .x1-login-hero { text-align: left; }
  .x1-login-title { font-size: 32px; }
  .x1-login-card-wrap { justify-content: stretch; }
  .x1-login-card { max-width: 100%; }
}