html,body{height:100%}body{margin:0;font-family:var(--font-text);font-size:15px;color:#171717;background:#f9f9f9;-webkit-font-smoothing:antialiased}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}.auth-screen{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;padding:24px 16px;background:radial-gradient(1200px 600px at 50% -10%,#fff,#fff0 70%),#f4f4f5}.auth-card{width:100%;max-width:380px;padding:40px 32px 28px;border-radius:28px;background:#fff;border:1px solid rgba(0,0,0,.06);box-shadow:0 1px 2px #0000000a,0 24px 48px -24px #0000002e;animation:rise .38s cubic-bezier(.22,1,.36,1)}@keyframes rise{0%{opacity:0;transform:translateY(12px)}}.auth-head{text-align:center;margin-bottom:28px}.auth-icon{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 20px;border-radius:16px;background:#171717;color:#fff;box-shadow:0 10px 24px -10px #00000073}.auth-icon svg{width:32px;height:32px;display:block}.auth-head h1{margin:0;font-family:var(--font-display);font-size:26px;font-weight:600;letter-spacing:-.03em;line-height:1.15}.auth-sub{margin:8px 0 0;font-size:14px;color:#737373}.auth-form{display:flex;flex-direction:column;gap:14px}.field{position:relative;display:block}.field-label{display:block;margin:0 0 6px 2px;font-size:13px;font-weight:500;color:#404040}.field input{width:100%;height:50px;padding:0 16px;border:1px solid #e5e5e5;border-radius:14px;background:#fff;color:#171717;font:inherit;outline:0;transition:border-color .15s ease,box-shadow .15s ease}.field input::placeholder{color:#a3a3a3}.field input:focus{border-color:#171717;box-shadow:0 0 0 4px #17171714}.field-pass input{padding-right:64px}.pass-toggle{position:absolute;right:7px;bottom:7px;height:36px;padding:0 10px;border-radius:10px;font-size:12px;font-weight:600;color:#737373}.pass-toggle:hover{color:#171717;background:#f5f5f5}.field-hint{margin:-6px 0 0 2px;font-size:12px;color:#8a8a8a}.field-hint.good{color:#0f8f66}.field-hint.bad{color:#d4483b}.auth-error{margin:0;padding:10px 12px;border-radius:12px;background:#fef2f2;color:#b91c1c;font-size:13px;font-weight:500}.auth-submit{display:grid;place-items:center;height:50px;margin-top:6px;border-radius:14px;background:#171717;color:#fff;font-weight:600;transition:transform .12s ease,box-shadow .15s ease,opacity .15s ease}.auth-submit:hover{box-shadow:0 10px 22px -10px #0000008c}.auth-submit:active{transform:scale(.98)}.auth-submit:disabled{opacity:.7;cursor:default}.auth-toggle{margin:22px 0 0;text-align:center;font-size:13px;color:#737373}.auth-toggle button{font-weight:600;color:#171717}.auth-toggle button:hover{text-decoration:underline;text-underline-offset:3px}.auth-foot{margin:0;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#a3a3a3}.spinner,.btn-spinner{width:24px;height:24px;border:2px solid rgba(0,0,0,.12);border-top-color:#171717;border-radius:50%;animation:spin .7s linear infinite}.btn-spinner{width:18px;height:18px;border-color:#ffffff4d;border-top-color:#fff}@keyframes spin{to{transform:rotate(360deg)}}html[data-theme=dark] body{background:#0a0a0a;color:#f5f5f5}html[data-theme=dark] .auth-screen{background:radial-gradient(1200px 600px at 50% -10%,#1a1a1a,#0a0a0a00 70%),#0a0a0a}html[data-theme=dark] .auth-card{background:#141414;border-color:#ffffff14;box-shadow:0 24px 48px -24px #000c}html[data-theme=dark] .auth-icon{background:#fff;color:#111}html[data-theme=dark] .auth-sub,html[data-theme=dark] .auth-toggle{color:#a3a3a3}html[data-theme=dark] .field-label{color:#d4d4d4}html[data-theme=dark] .field input{background:#0f0f0f;border-color:#2a2a2a;color:#f5f5f5}html[data-theme=dark] .field input:focus{border-color:#f5f5f5;box-shadow:0 0 0 4px #ffffff14}html[data-theme=dark] .pass-toggle:hover{color:#f5f5f5;background:#1f1f1f}html[data-theme=dark] .auth-submit{background:#f5f5f5;color:#111}html[data-theme=dark] .auth-toggle button{color:#f5f5f5}html[data-theme=dark] .auth-error{background:#b91c1c26;color:#fca5a5}html[data-theme=dark] .spinner{border-color:#ffffff26;border-top-color:#f5f5f5}html[data-theme=dark] .btn-spinner{border-color:#0003;border-top-color:#111}@media (prefers-color-scheme: dark){html:not([data-theme=light]) body{background:#0a0a0a;color:#f5f5f5}html:not([data-theme=light]) .auth-screen{background:radial-gradient(1200px 600px at 50% -10%,#1a1a1a,#0a0a0a00 70%),#0a0a0a}html:not([data-theme=light]) .auth-card{background:#141414;border-color:#ffffff14;box-shadow:0 24px 48px -24px #000c}html:not([data-theme=light]) .auth-icon{background:#fff;color:#111}html:not([data-theme=light]) .auth-sub,html:not([data-theme=light]) .auth-toggle{color:#a3a3a3}html:not([data-theme=light]) .field-label{color:#d4d4d4}html:not([data-theme=light]) .field input{background:#0f0f0f;border-color:#2a2a2a;color:#f5f5f5}html:not([data-theme=light]) .field input:focus{border-color:#f5f5f5;box-shadow:0 0 0 4px #ffffff14}html:not([data-theme=light]) .pass-toggle:hover{color:#f5f5f5;background:#1f1f1f}html:not([data-theme=light]) .auth-submit{background:#f5f5f5;color:#111}html:not([data-theme=light]) .auth-toggle button{color:#f5f5f5}html:not([data-theme=light]) .auth-error{background:#b91c1c26;color:#fca5a5}html:not([data-theme=light]) .spinner{border-color:#ffffff26;border-top-color:#f5f5f5}html:not([data-theme=light]) .btn-spinner{border-color:#0003;border-top-color:#111}}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{touch-action:manipulation;-webkit-tap-highlight-color:transparent}@media (max-width: 480px){.auth-screen{justify-content:flex-start;padding-top:12vh}.auth-card{padding:32px 22px 24px;border-radius:24px}}@media (max-width: 767px){input,textarea{font-size:16px!important}.auth-screen{min-height:var(--app-height, 100dvh)}}body{background:#ebe8f7}.auth-screen{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(160deg,#f1eefb,#e4dff4 55%,#dcd6ef)!important}.auth-screen:before,.auth-screen:after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(70px);opacity:.75;pointer-events:none}.auth-screen:before{width:560px;height:560px;left:-120px;top:-160px;background:radial-gradient(circle at 40% 40%,#c9bdf5,#c9bdf500 70%);animation:sig-drift-a 22s ease-in-out infinite alternate}.auth-screen:after{width:620px;height:620px;right:-180px;bottom:-220px;background:radial-gradient(circle at 50% 50%,#f6cfe0,#f6cfe000 65%),radial-gradient(circle at 70% 30%,#c8ecea,#c8ecea00 60%);animation:sig-drift-b 26s ease-in-out infinite alternate}@keyframes sig-drift-a{to{transform:translate(120px,80px) scale(1.1)}}@keyframes sig-drift-b{to{transform:translate(-100px,-70px) scale(1.08)}}.auth-card{position:relative;max-width:392px!important;padding:44px 34px 30px!important;border-radius:32px!important;background:#ffffffb8!important;border:1px solid rgba(255,255,255,.9)!important;box-shadow:0 1px 2px #281e5a0d,0 30px 70px -28px #3c288259,inset 0 1px #ffffffe6!important;backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%)}.auth-icon{position:relative;width:60px!important;height:60px!important;border-radius:19px!important;box-shadow:0 14px 30px -12px #281e5a8c!important}.auth-icon:after{content:"";position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;border-radius:25px;z-index:-1;background:radial-gradient(circle,#967deb59,#967deb00 70%);animation:sig-halo 3.6s ease-in-out infinite}@keyframes sig-halo{0%,to{opacity:.5;transform:scale(.95)}50%{opacity:1;transform:scale(1.08)}}.auth-head h1{font-size:28px!important}.auth-sub{color:#6f6a82!important}.field-label{color:#4a4560!important;margin-left:14px!important}.field input{height:52px!important;padding:0 20px!important;border-radius:999px!important;border:1px solid rgba(40,30,90,.08)!important;background:#ffffffe6!important;box-shadow:0 1px 2px #281e5a0a!important}.field input:focus{border-color:#7864dc8c!important;box-shadow:0 0 0 4px #7864dc24!important}.field-pass input{padding-right:76px!important}.pass-toggle{right:8px!important;bottom:8px!important;border-radius:999px!important;padding:0 14px!important}.pass-toggle:hover{background:#7864dc14!important}.auth-error{border-radius:16px!important}.auth-submit{position:relative;overflow:hidden;height:52px!important;border-radius:999px!important;background:#171717!important;box-shadow:0 12px 26px -12px #17171799!important}.auth-submit:after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,#fff0,#ffffff38,#fff0);transition:left .6s ease}.auth-submit:hover:after{left:120%}.auth-submit:hover{transform:translateY(-1px)}.auth-foot{color:#8c86a3!important}.auth-card:before,.auth-card:after{position:absolute;pointer-events:none;display:none;font-family:var(--font-text);font-size:14px;font-weight:500;line-height:1;padding:12px 16px;border-radius:20px;white-space:nowrap;box-shadow:0 14px 34px -14px #3c288259}@media (min-width: 900px){.auth-card:before,.auth-card:after{display:block}.auth-card:before{content:"Hey, you're back";left:-170px;top:120px;background:#fff;color:#171717;border-bottom-left-radius:6px;animation:sig-float 6s ease-in-out infinite,sig-pop .6s .3s both cubic-bezier(.2,.8,.2,1)}.auth-card:after{content:"• • •";right:-96px;bottom:150px;letter-spacing:2px;background:#171717;color:#fff;border-bottom-right-radius:6px;animation:sig-float 7s 1s ease-in-out infinite,sig-pop .6s .7s both cubic-bezier(.2,.8,.2,1)}}@keyframes sig-float{0%,to{translate:0 0}50%{translate:0 -10px}}@keyframes sig-pop{0%{opacity:0;scale:.8}to{opacity:1;scale:1}}html[data-theme=dark] body{background:#0e0d12}html[data-theme=dark] .auth-screen{background:linear-gradient(160deg,#15131c,#0e0d12)!important}html[data-theme=dark] .auth-screen:before{background:radial-gradient(circle,#3a2f6b,#3a2f6b00 70%);opacity:.8}html[data-theme=dark] .auth-screen:after{background:radial-gradient(circle,#4a2440,#4a244000 65%);opacity:.6}html[data-theme=dark] .auth-card{background:#1c1a24b8!important;border-color:#ffffff14!important;box-shadow:0 30px 70px -28px #000c,inset 0 1px #ffffff0d!important}html[data-theme=dark] .field input{background:#ffffff0d!important;border-color:#ffffff1a!important}html[data-theme=dark] .field-label{color:#cfcadf!important}html[data-theme=dark] .auth-submit{background:#f5f5f5!important;color:#111!important}html[data-theme=dark] .auth-card:before{background:#26242e;color:#f5f5f5}html[data-theme=dark] .auth-card:after{background:#f5f5f5;color:#111}@media (prefers-color-scheme: dark){html:not([data-theme=light]) body{background:#0e0d12}html:not([data-theme=light]) .auth-screen{background:linear-gradient(160deg,#15131c,#0e0d12)!important}html:not([data-theme=light]) .auth-screen:before{background:radial-gradient(circle,#3a2f6b,#3a2f6b00 70%);opacity:.8}html:not([data-theme=light]) .auth-screen:after{background:radial-gradient(circle,#4a2440,#4a244000 65%);opacity:.6}html:not([data-theme=light]) .auth-card{background:#1c1a24b8!important;border-color:#ffffff14!important;box-shadow:0 30px 70px -28px #000c!important}html:not([data-theme=light]) .field input{background:#ffffff0d!important;border-color:#ffffff1a!important}html:not([data-theme=light]) .field-label{color:#cfcadf!important}html:not([data-theme=light]) .auth-submit{background:#f5f5f5!important;color:#111!important}html:not([data-theme=light]) .auth-card:before{background:#26242e;color:#f5f5f5}html:not([data-theme=light]) .auth-card:after{background:#f5f5f5;color:#111}}@media (prefers-reduced-motion: reduce){.auth-screen:before,.auth-screen:after,.auth-icon:after,.auth-card:before,.auth-card:after{animation:none!important}}@media (max-width: 480px){.auth-card{padding:34px 22px 24px!important;border-radius:28px!important}}@media (min-width: 900px){.auth-card[data-mode=register]:before{content:"Welcome to Bean"}}
