/* sign-up and log-in over a soft-focused picture of the real app (templates/signup.html, login.html) */
.auth.auth-peek { display: flex; align-items: center; justify-content: center; padding: 72px 16px 40px; background: #dcdcea var(--peek) center top / cover no-repeat; }
.auth.auth-peek::before { content: ""; position: fixed; inset: 0; background: rgba(150, 150, 175, .35); pointer-events: none; }
.auth-peek .auth-card { position: relative; margin: 0; padding: 40px clamp(20px, 5vw, 48px); max-width: 520px; gap: 20px; background: var(--surface-solid); border-radius: 28px; box-shadow: 0 50px 100px -20px rgba(10, 8, 40, .45); }
.auth-peek .auth-tag { font: 700 1.05rem/1.3 var(--font-display); color: var(--accent); margin: 0; }
.auth-peek .auth-start { margin: 8px 0 0; font-weight: 600; color: var(--accent); }
.auth-peek .auth-ticks { display: flex; flex-wrap: wrap; gap: 6px 16px; list-style: none; margin: 0; padding: 0; font-size: .92rem; }
.auth-peek .auth-ticks li { display: flex; align-items: center; gap: 6px; }
.auth-peek .auth-ticks svg { color: #0d7a45; flex: none; }
:root[data-theme="light"] .auth-peek .auth-card { background: #fff; }
.auth-peek .auth-card { -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); }