// V1 Login — editorial spread, not a card-in-a-modal. // Left: Midnight Steel marketing column with oversized headline, ambient // Electric Indigo bloom, and a short trust-signal ledger. // Right: Pure White form column with hairline-underline inputs, sheen-sweep // submit, SSO chips, and a magic-link success state that crossfades in. function V1LoginField({ id, label, type = 'text', value, onChange, icon, trailing, focused, onFocus, onBlur, autoComplete }) { const isActive = focused; return ( ); } function V1LoginPage({ onClose, onSignIn, onApply, onNavLegal }) { const mounted = useV1Mounted(60); const [email, setEmail] = React.useState(''); const [password, setPassword] = React.useState(''); const [showPassword, setShowPassword] = React.useState(false); const [rememberMe, setRememberMe] = React.useState(false); const [focused, setFocused] = React.useState(null); const [hoverSubmit, setHoverSubmit] = React.useState(false); const [hoverForgot, setHoverForgot] = React.useState(false); const [hoverGoogle, setHoverGoogle] = React.useState(false); const [hoverFacebook, setHoverFacebook] = React.useState(false); const [hoverApply, setHoverApply] = React.useState(false); const [hoverBack, setHoverBack] = React.useState(false); const [sent, setSent] = React.useState(false); const handleSubmit = (e) => { e.preventDefault(); setSent(true); onSignIn && onSignIn(email || 'operator@delt.capital'); }; const enter = (delay) => ({ opacity: mounted ? 1 : 0, transform: mounted ? 'translate3d(0,0,0)' : 'translate3d(0,10px,0)', transition: `opacity 720ms cubic-bezier(0.22, 1, 0.36, 1) ${delay}ms, transform 720ms cubic-bezier(0.22, 1, 0.36, 1) ${delay}ms`, }); const trustSignals = [ { eyebrow: 'Compliance', body: 'SOC 2 Type II · audited Q1 2026' }, { eyebrow: 'Session', body: 'Expires in 20 min · browser-local only' }, { eyebrow: 'Last login', body: 'Oct 12 · Los Angeles (you)' }, ]; const nowLabel = (() => { const d = new Date(); const hh = String(d.getHours()).padStart(2, '0'); const mm = String(d.getMinutes()).padStart(2, '0'); return `${hh}:${mm} PT`; })(); return (
{/* ─── LEFT — Midnight Steel marketing panel ─── */} {/* ─── RIGHT — Pure White form panel ─── */}
{/* Top row: back + signin eyebrow */}
Sign in
{/* Card wrapper — centered */}
{/* Form state */}

Sign in to your Delt account.

{/* Hairline rule */}
setEmail(e.target.value)} focused={focused === 'email'} onFocus={() => setFocused('email')} onBlur={() => setFocused(null)} autoComplete="email" icon={ } />
setPassword(e.target.value)} focused={focused === 'password'} onFocus={() => setFocused('password')} onBlur={() => setFocused(null)} autoComplete="current-password" icon={ } trailing={ } />
{/* Remember + Forgot */}
{/* Submit */}
{/* Divider */}
or continue with
{/* SSO */}
{[ { k: 'google', label: 'Google', hover: hoverGoogle, set: setHoverGoogle, icon: ( ), }, { k: 'facebook', label: 'Facebook', hover: hoverFacebook, set: setHoverFacebook, icon: ( ), }, ].map((sso) => ( ))}
{/* Apply prompt */}
Not a customer yet?
By signing in you agree to{' '} {' · '}
{/* Success state */}
{sent && (

Magic link sent.

We emailed a sign-in link to{' '} {email || 'operator@delt.capital'}. Open it on this device to finish signing in.

Sent · {nowLabel} · expires in 10 min
)}
); } Object.assign(window, { V1LoginPage });