/* Loaded only for the two optional login effects. */
.guest-shell .main-content{max-width:none;padding:0;display:block}
.login-effect-screen{position:relative;isolation:isolate;display:grid;place-items:center;min-block-size:100vh;min-block-size:100svh;padding:40px 24px 72px}
.login-effect-background{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:linear-gradient(135deg,#173f56,#3d807f 48%,#a8ccbe)}
[data-login-effect="mandelbrot"] .login-effect-background{background:radial-gradient(ellipse at 35% 35%,#634872,#213a58 48%,#111c2c 90%)}
.login-effect-background canvas{position:absolute;inset:0;display:block;width:100%;height:100%;opacity:0;transition:opacity 1.2s ease}
.login-effect-background canvas.is-visible{opacity:1}
.login-effect-card{inline-size:min(100%,320px);min-inline-size:0;padding:24px;border:1px solid var(--border);border-radius:24px;background:var(--surface);color:var(--text);box-shadow:0 16px 64px #061b3833}
.login-effect-brand{display:flex;align-items:center;justify-content:center;gap:10px;margin-block-end:20px}
.login-effect-brand .brand-mark{inline-size:36px;block-size:36px;border-radius:12px;flex:none}
.login-effect-brand h1{font-size:19px;line-height:1.65;margin:0;overflow-wrap:anywhere;max-inline-size:100%}
.login-effect-card form{margin:0}
.login-effect-card .field{margin-block-end:14px}
.login-effect-card .field label{font-size:12px;line-height:1.8;margin-block-end:5px}
.login-effect-card .field input{inline-size:100%;min-inline-size:0;min-block-size:44px;font-size:16px;padding:9px 11px}
.login-effect-card .button{min-block-size:44px;margin-block-start:4px}
.login-effect-card .form-errors{font-size:12px;overflow-wrap:anywhere}
.login-effect-help{margin-block-start:14px;font-size:11px;color:var(--muted)}
.login-effect-help summary{cursor:pointer;min-block-size:32px;display:list-item;line-height:32px;list-style-position:inside}
.login-effect-help p{margin:4px 0 0;line-height:1.9}
.login-motion-toggle{position:fixed;inset-block-end:max(12px,env(safe-area-inset-bottom));inset-inline-end:max(16px,env(safe-area-inset-right));min-block-size:44px;padding:6px 14px;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text);font:12px var(--font);cursor:pointer;box-shadow:var(--shadow)}
.login-motion-toggle:focus-visible,.login-effect-help summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.guest-shell .flash-stack{position:relative;z-index:2;max-inline-size:320px;margin:16px auto;padding-inline:16px}
@media(max-width:480px){.login-effect-screen{padding-inline:32px}.login-effect-card{inline-size:min(100%,288px);padding:22px 18px;border-radius:20px}}
@media(max-height:500px){.login-effect-screen{place-items:start center;padding-block-start:20px}.login-motion-toggle{position:absolute;inset-block-end:12px}}
@media(prefers-reduced-motion:reduce){.login-effect-background canvas{transition:none}}
@media(forced-colors:active){.login-effect-background{display:none}.login-effect-card,.login-motion-toggle{border:1px solid CanvasText}}
