{
  "name": "auth-card-content",
  "kind": "block",
  "primary": "section",
  "instances": [
    {
      "page": "/apps/errors/app/404/404.contents.html",
      "source": "apps/errors/app/404/404.contents.html",
      "slots": [],
      "nested": [
        "error-404-actions"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"info\" icon=\"map-trifold\">\n              <span slot=\"content\">Path: <code>/that/route/that/wasnt/found</code></span>\n            </alert-ui>\n\n            <col-ui gap=\"2\" size=\"lg\"><!-- nested: error-404-actions --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\" size=\"sm\"> Trace ID: <code>req_18d2f7c4</code> </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/errors/app/500/500.contents.html",
      "source": "apps/errors/app/500/500.contents.html",
      "slots": [],
      "nested": [
        "error-500-actions"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"warning\" icon=\"warning\">\n              <span slot=\"content\">Error reference: <code>err_a8f2d910</code> · Reported 12:42 UTC. Include this ID when contacting support.</span>\n            </alert-ui>\n\n            <col-ui gap=\"2\" size=\"lg\"><!-- nested: error-500-actions --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\">\n              <a href=\"/\">← Back to homepage</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/errors/app/maintenance/maintenance.contents.html",
      "source": "apps/errors/app/maintenance/maintenance.contents.html",
      "slots": [],
      "nested": [
        "error-maintenance-actions"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"info\" icon=\"wrench\">\n              <span slot=\"content\"\n                >Window: <strong>12:00 – 12:30 UTC</strong> · Affected: web app, API, webhooks. Status pages remain online during the window.</span\n              >\n            </alert-ui>\n\n            <col-ui gap=\"2\" size=\"lg\"><!-- nested: error-maintenance-actions --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\" size=\"sm\"> Started 12:05 UTC </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/accept-invite/accept-invite.contents.html",
      "source": "apps/user-flow/app/auth/accept-invite/accept-invite.contents.html",
      "slots": [],
      "nested": [
        "auth-invite-team-card",
        "auth-invite-actions"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <card-ui><!-- nested: auth-invite-team-card --></card-ui>\n\n            <text-ui align=\"center\"\n              >You'll sign in as <strong color=\"accent\">kim@acme.com</strong>. As a Member you can read and write all team workspaces.</text-ui\n            >\n\n            <col-ui gap=\"2\" size=\"lg\"><!-- nested: auth-invite-actions --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\" size=\"sm\">\n              Not the right account? <a href=\"/site/examples/auth/sign-in\">Sign in with a different one</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/account-deleted/account-deleted.contents.html",
      "source": "apps/user-flow/app/auth/account-deleted/account-deleted.contents.html",
      "slots": [],
      "nested": [
        "auth-account-deleted-actions"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"warning\" icon=\"clock-counter-clockwise\">\n              <span slot=\"content\"\n                >We've removed <strong>kim@acme.com</strong> from AdiaUI. Workspace data was archived; billing history retained for 30 days for tax compliance.\n                <strong>14 days to reverse</strong> — if this was a mistake, sign back in within two weeks to fully recover your account. After that the\n                deletion is permanent.</span\n              >\n            </alert-ui>\n\n            <col-ui gap=\"2\" size=\"lg\"><!-- nested: auth-account-deleted-actions --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\" size=\"sm\">\n              Need help or want to keep your data? <a href=\"/site/examples/help\">Contact support</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/account-locked/account-locked.contents.html",
      "source": "apps/user-flow/app/auth/account-locked/account-locked.contents.html",
      "slots": [],
      "nested": [
        "auth-locked-recovery-options"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"warning\" icon=\"lock\">\n              <span slot=\"content\"\n                >Too many failed sign-in attempts on <strong>kim@acme.com</strong>. For your security, we've paused sign-ins for <strong>15 minutes</strong> —\n                pick a recovery option below to unlock sooner.</span\n              >\n            </alert-ui>\n\n            <col-ui gap=\"2\"><!-- nested: auth-locked-recovery-options --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\">\n              <a href=\"/site/examples/auth/sign-in\">← Back to sign in</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/email-change/verify/verify.contents.html",
      "source": "apps/user-flow/app/auth/email-change/verify/verify.contents.html",
      "slots": [],
      "nested": [
        "auth-email-verify-confirm"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <form size=\"lg\" action=\"/site/examples/profile-security\" method=\"get\"><!-- nested: auth-email-verify-confirm --></form>\n\n            <text-ui text-align=\"center\" color=\"subtle\">\n              <a href=\"/site/examples/profile-security\">← This wasn't me — undo the change</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/forbidden/forbidden.contents.html",
      "source": "apps/user-flow/app/auth/forbidden/forbidden.contents.html",
      "slots": [],
      "nested": [
        "auth-forbidden-actions"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"warning\" icon=\"lock-key\">\n              <span slot=\"content\"\n                >Your account <strong>kim@acme.com</strong> doesn't have permission to view this resource. This may be the wrong account, or your role may not\n                include access — switch to a different account or ask the workspace admin.</span\n              >\n            </alert-ui>\n\n            <col-ui gap=\"2\" size=\"lg\"><!-- nested: auth-forbidden-actions --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\" size=\"sm\"> Think this is a mistake? <a href=\"/site/examples/help\">Contact support</a> </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/forgot-password/forgot-password.contents.html",
      "source": "apps/user-flow/app/auth/forgot-password/forgot-password.contents.html",
      "slots": [],
      "nested": [
        "auth-password-reset-form"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <form size=\"lg\" action=\"/site/examples/auth/forgot-password/sent\" method=\"get\"><!-- nested: auth-password-reset-form --></form>\n\n            <text-ui text-align=\"center\" color=\"subtle\">\n              <a href=\"/site/examples/auth/sign-in\">← Back to sign in</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/forgot-password/sent/sent.contents.html",
      "source": "apps/user-flow/app/auth/forgot-password/sent/sent.contents.html",
      "slots": [],
      "nested": [],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"info\" icon=\"info\">\n              <span slot=\"content\">Didn't get the email? Check your spam folder, or wait <strong>30 seconds</strong> before requesting a new link.</span>\n            </alert-ui>\n\n            <button-ui text=\"Resend link\" icon=\"arrow-clockwise\" variant=\"outline\" disabled></button-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\">\n              <a href=\"/site/examples/auth/forgot-password\">← Use a different email</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/link-expired/link-expired.contents.html",
      "source": "apps/user-flow/app/auth/link-expired/link-expired.contents.html",
      "slots": [],
      "nested": [
        "auth-link-expired-form"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"warning\" icon=\"link-break\">\n              <span slot=\"content\"\n                >The link you followed has either been used already or passed its expiry — each link works once. For your security, magic links and reset links\n                expire after a short window. Request a fresh one to continue.</span\n              >\n            </alert-ui>\n\n            <form size=\"lg\" action=\"/site/examples/auth/forgot-password/sent\" method=\"get\"><!-- nested: auth-link-expired-form --></form>\n\n            <text-ui text-align=\"center\" color=\"subtle\">\n              <a href=\"/site/examples/auth/sign-in\">← Back to sign in</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/oauth/callback/callback.contents.html",
      "source": "apps/user-flow/app/auth/oauth/callback/callback.contents.html",
      "slots": [],
      "nested": [
        "auth-oauth-fallback-actions"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"info\" icon=\"clock\">\n              <span slot=\"content\">Taking longer than usual? Your provider may be experiencing delays — try again in a moment.</span>\n            </alert-ui>\n\n            <col-ui gap=\"2\" size=\"lg\"><!-- nested: auth-oauth-fallback-actions --></col-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/reset-password/reset-password.contents.html",
      "source": "apps/user-flow/app/auth/reset-password/reset-password.contents.html",
      "slots": [],
      "nested": [
        "auth-new-password-form"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <form size=\"lg\"><!-- nested: auth-new-password-form --></form>\n\n            <text-ui text-align=\"center\" color=\"subtle\">\n              <a href=\"/site/examples/auth/sign-in\">← Back to sign in</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/session-expired/session-expired.contents.html",
      "source": "apps/user-flow/app/auth/session-expired/session-expired.contents.html",
      "slots": [],
      "nested": [
        "auth-session-expired-actions"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"info\" icon=\"clock-counter-clockwise\">\n              <span slot=\"content\"\n                >For your security, we ended the session for <strong>kim@acme.com</strong> after a period of inactivity. Your work is safe — sign back in to\n                pick up where you left off.</span\n              >\n            </alert-ui>\n\n            <col-ui gap=\"2\" size=\"lg\"><!-- nested: auth-session-expired-actions --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\" size=\"sm\"> Need help? <a href=\"/site/examples/help\">Contact support</a> </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/sign-in/mfa/mfa.contents.html",
      "source": "apps/user-flow/app/auth/sign-in/mfa/mfa.contents.html",
      "slots": [],
      "nested": [
        "auth-mfa-fallback-actions"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <col-ui align=\"center\">\n              <otp-input-ui size=\"lg\" length=\"6\" autocomplete=\"one-time-code\"></otp-input-ui>\n            </col-ui>\n\n            <text-ui text-align=\"center\">\n              <a href=\"/site/examples/auth/sign-in/mfa/recovery\">Use a backup code instead</a>\n            </text-ui>\n\n            <divider-ui label=\"or\"></divider-ui>\n\n            <col-ui gap=\"2\"><!-- nested: auth-mfa-fallback-actions --></col-ui>\n\n            <text-ui text-align=\"center\">\n              <a href=\"/site/examples/auth/sign-in\">← Sign out</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/sign-in/mfa/recovery/recovery.contents.html",
      "source": "apps/user-flow/app/auth/sign-in/mfa/recovery/recovery.contents.html",
      "slots": [],
      "nested": [
        "auth-mfa-recovery"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <form size=\"lg\"><!-- nested: auth-mfa-recovery --></form>\n\n            <alert-ui variant=\"info\" icon=\"info\">\n              <span slot=\"content\">Lost your backup codes? <a href=\"#\">Contact support</a> to regain access.</span>\n            </alert-ui>\n\n            <text-ui text-align=\"center\">\n              <a href=\"/site/examples/auth/sign-in/mfa\">← Back to two-factor</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/sign-in/password/password.contents.html",
      "source": "apps/user-flow/app/auth/sign-in/password/password.contents.html",
      "slots": [],
      "nested": [
        "auth-password-challenge"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <form size=\"lg\"><!-- nested: auth-password-challenge --></form>\n\n            <divider-ui label=\"or use a one-time code\"></divider-ui>\n\n            <col-ui gap=\"2\">\n              <button-ui text=\"Email me a magic link\" icon=\"envelope-simple\" variant=\"outline\"></button-ui>\n              <button-ui text=\"Send me a 6-digit code\" icon=\"number-square-six\" variant=\"outline\"></button-ui>\n            </col-ui>\n\n            <text-ui text-align=\"center\">\n              <a href=\"/site/examples/auth/sign-in\">← Use a different email</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/sign-in/sign-in.contents.html",
      "source": "apps/user-flow/app/auth/sign-in/sign-in.contents.html",
      "slots": [],
      "nested": [
        "auth-email-entry",
        "auth-social-auths"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"4\">\n            <form\n              size=\"lg\" action=\"/site/examples/auth/sign-in/password\" method=\"get\"><!-- nested: auth-email-entry --></form>\n\n            <divider-ui label=\"or\"></divider-ui>\n\n            <col-ui gap=\"2\"><!-- nested: auth-social-auths --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\"> Don't have an account? <a href=\"/site/examples/auth/sign-up\">Sign up</a> </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/sign-out/sign-out.contents.html",
      "source": "apps/user-flow/app/auth/sign-out/sign-out.contents.html",
      "slots": [],
      "nested": [
        "auth-signout-actions"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <col-ui gap=\"2\" size=\"lg\"><!-- nested: auth-signout-actions --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\">\n              <a href=\"/\">← Back to homepage</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/sign-up/mfa-setup/mfa-setup.contents.html",
      "source": "apps/user-flow/app/auth/sign-up/mfa-setup/mfa-setup.contents.html",
      "slots": [],
      "nested": [
        "auth-mfa-enrollment-submit"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <col-ui align=\"center\" gap=\"3\">\n              <div data-auth-qr aria-label=\"Authenticator QR code (placeholder)\">\n                <icon-ui name=\"qr-code\" size=\"4xl\"></icon-ui>\n              </div>\n              <col-ui gap=\"2\" align=\"center\">\n                <text-ui color=\"subtle\" size=\"sm\">Or enter manually:</text-ui>\n                <code>JBSW Y3DP EHPK 3PXP</code>\n              </col-ui>\n            </col-ui>\n\n            <col-ui align=\"center\" gap=\"2\">\n              <otp-input-ui size=\"lg\" length=\"6\" autocomplete=\"one-time-code\" name=\"totp\"></otp-input-ui>\n              <text-ui color=\"subtle\" size=\"sm\">From Google Authenticator, 1Password, Authy, or similar.</text-ui>\n            </col-ui>\n\n            <form size=\"lg\" action=\"/site/examples/dashboard\" method=\"get\"><!-- nested: auth-mfa-enrollment-submit --></form>\n\n            <alert-ui variant=\"info\" icon=\"key\">\n              <span slot=\"content\"\n                ><strong>Save your backup codes.</strong> You'll see 10 single-use codes after verifying — store them somewhere safe in case you lose your\n                device.</span\n              >\n            </alert-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\">\n              <a href=\"/site/examples/dashboard\">Skip for now — set up later in settings</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/sign-up/profile/profile.contents.html",
      "source": "apps/user-flow/app/auth/sign-up/profile/profile.contents.html",
      "slots": [],
      "nested": [
        "auth-profile-form"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <form size=\"lg\"><!-- nested: auth-profile-form --></form>\n\n            <text-ui text-align=\"center\" color=\"subtle\">\n              <a href=\"#\">Skip for now</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/sign-up/sign-up.contents.html",
      "source": "apps/user-flow/app/auth/sign-up/sign-up.contents.html",
      "slots": [],
      "nested": [
        "auth-signup-email-entry",
        "auth-signup-social-auths"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <form size=\"lg\" action=\"/site/examples/auth/sign-up/verify\" method=\"get\"><!-- nested: auth-signup-email-entry --></form>\n\n            <divider-ui label=\"or\"></divider-ui>\n\n            <col-ui gap=\"2\"><!-- nested: auth-signup-social-auths --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\" size=\"sm\">\n              By continuing you agree to the\n              <a href=\"#\">Terms of Service</a> and <a href=\"#\">Privacy Policy</a>.\n            </text-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\"> Already have an account? <a href=\"/site/examples/auth/sign-in\">Sign in</a> </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/sign-up/sso-only/sso-only.contents.html",
      "source": "apps/user-flow/app/auth/sign-up/sso-only/sso-only.contents.html",
      "slots": [],
      "nested": [
        "auth-sso-providers"
      ],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"info\" icon=\"shield-check\">\n              <span slot=\"content\"\n                ><strong>Acme</strong> requires SSO authentication. Your admin can configure additional providers from organization settings.</span\n              >\n            </alert-ui>\n\n            <col-ui gap=\"2\" size=\"lg\"><!-- nested: auth-sso-providers --></col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\" size=\"sm\">\n              Wrong account? <a href=\"/site/examples/auth/sign-up\">Use a personal email instead</a>\n            </text-ui>\n          </col-ui>\n        </section>"
    },
    {
      "page": "/apps/user-flow/app/auth/sign-up/verify/verify.contents.html",
      "source": "apps/user-flow/app/auth/sign-up/verify/verify.contents.html",
      "slots": [],
      "nested": [],
      "attrs": {},
      "html": "<section>\n          <col-ui gap=\"6\">\n            <col-ui align=\"center\">\n              <otp-input-ui size=\"lg\" length=\"6\" autocomplete=\"one-time-code\"></otp-input-ui>\n            </col-ui>\n\n            <alert-ui variant=\"warning\" icon=\"warning\">\n              <span slot=\"content\">\n                Already have an account? If you're still waiting on your code,\n                <a href=\"/site/examples/auth/sign-in\">try signing in instead</a>.\n              </span>\n            </alert-ui>\n\n            <text-ui text-align=\"center\">\n              <a href=\"/site/examples/auth/sign-up\">← Back</a>\n            </text-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\"> Already have an account? <a href=\"/site/examples/auth/sign-in\">Sign in</a> </text-ui>\n          </col-ui>\n        </section>"
    }
  ],
  "captured_at": "2026-06-07T19:28:13.657Z",
  "metadata": {
    "domain": "auth",
    "description": "Auth card body section — inner scrollable content area of the centered auth card shell.",
    "keywords": [
      "auth",
      "card",
      "content",
      "body",
      "section",
      "shell",
      "inner"
    ]
  }
}
