body { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--bg, #f7f8fa); padding: 24px; }
    .auth-card {
      width: 100%; max-width: 460px;
      background: var(--panel, #fff);
      border: 1px solid var(--border, #e5e7eb);
      border-radius: 16px;
      padding: 32px 28px 28px;
      box-shadow: 0 8px 32px rgba(0,0,0,.08);
    }
    .auth-card h1 { font-size: 1.4rem; margin: 0 0 8px; }
    .auth-card p { margin: 0 0 14px; color: var(--text-muted); font-size: .92rem; line-height: 1.5; }
    .brand-row { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
    .brand-row .logo { width: 32px; height: 32px; border-radius: 8px; background: var(--accent, #3b82f6); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; }
    .closed-badge {
      display: inline-block; padding: 4px 10px; border-radius: 999px;
      background: rgba(245, 158, 11, 0.12); color: #b45309;
      border: 1px solid rgba(245, 158, 11, 0.4); font-size: .78rem; font-weight: 600;
      margin-bottom: 14px;
    }
    .auth-card .actions { margin-top: 18px; display: flex; gap: 10px; }
    .auth-card a.btn {
      flex: 1; text-align: center; padding: 11px 14px; border-radius: 10px;
      text-decoration: none; font-weight: 600; font-size: .92rem;
      background: var(--accent, #3b82f6); color: #fff; border: 1px solid var(--accent, #3b82f6);
    }
    .auth-card a.btn.secondary { background: transparent; color: var(--text); border-color: var(--border, #e5e7eb); }
    @media (max-width: 480px) {
      body { padding: 16px; align-items: flex-start; padding-top: 40px; }
      .auth-card { padding: 24px 18px 20px; border-radius: 12px; max-width: 100%; }
      .auth-card h1 { font-size: 1.2rem; }
      .auth-card .actions { flex-direction: column; }
    }