:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color-scheme:dark;--auth-bg:#0c1220;--auth-panel:#131d2e;--auth-surface:#1b283c;--auth-text:#f7f8fd;--auth-muted:#b4c0d2;--auth-border:#334159;--auth-input:#10192a;--auth-accent:#e34bb7;--auth-blue:#6489ff;--auth-error:#ff9ea8;--auth-shadow:0 30px 90px #04091875}
html[data-theme="dark"]{--auth-bg:#08090e;--auth-panel:#11131b;--auth-surface:#191c26;--auth-text:#fbfaff;--auth-muted:#b9bac7;--auth-border:#383744;--auth-input:#0c0e16;--auth-accent:#f05dc4;--auth-blue:#8194ff;--auth-error:#ffadb5}
html[data-theme="light"]{color-scheme:light;--auth-bg:#f4f6fb;--auth-panel:#fff;--auth-surface:#f5f7fc;--auth-text:#172036;--auth-muted:#526078;--auth-border:#d7deea;--auth-input:#fff;--auth-accent:#b3218c;--auth-blue:#3a59be;--auth-error:#a72238;--auth-shadow:0 30px 90px #283b6120}
*,*::before,*::after{box-sizing:border-box}
html{min-width:320px}
body{margin:0;min-height:100vh;background:var(--auth-bg);color:var(--auth-text);font-size:16px;line-height:1.5}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed}
a{color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--auth-blue);outline-offset:3px}
.auth-shell{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(circle at 95% 0%,#5b3ea01e,transparent 32%),var(--auth-bg)}
.auth-header{width:min(1440px,100%);margin:auto auto 0;padding:22px clamp(24px,4vw,64px);display:flex;align-items:center;justify-content:space-between;gap:24px}
.auth-brand{display:inline-flex;align-items:center;min-height:48px;max-width:190px}
.auth-brand img{display:block;max-width:100%;height:auto;max-height:42px;object-fit:contain;object-position:left}
.auth-exit{text-decoration:none;color:var(--auth-muted);font-size:.9rem;font-weight:650;white-space:nowrap}
.auth-exit:hover{color:var(--auth-text)}
.auth-exit span{display:inline-block;margin-left:7px;color:var(--auth-accent)}
.auth-main{width:min(1440px,100%);margin:0 auto auto;padding:clamp(18px,3vw,44px) clamp(24px,4vw,64px) clamp(32px,5vw,72px);display:grid;grid-template-columns:minmax(0,.92fr) minmax(460px,1fr);min-height:690px;align-items:stretch}
.auth-story{position:relative;isolation:isolate;overflow:hidden;border-radius:28px 0 0 28px;background:linear-gradient(145deg,#172747 5%,#302052 60%,#551e5f);color:#fff;min-height:620px}
.auth-story::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 100% 3%,#ff6cc477,transparent 27%),radial-gradient(circle at 5% 95%,#507fff77,transparent 40%)}
.auth-story::after{content:"";position:absolute;right:-125px;bottom:-200px;width:520px;height:520px;border:1px solid #ffffff32;border-radius:50%;box-shadow:0 0 0 54px #ffffff0c,0 0 0 108px #ffffff0b,0 0 0 162px #ffffff09;z-index:-1}
.auth-story-inner{height:100%;display:flex;flex-direction:column;padding:clamp(36px,5vw,76px)}
.auth-kicker{display:flex;align-items:center;gap:14px;margin:0 0 auto;font-size:.8rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#efdbf0}
.auth-kicker-line{width:28px;height:2px;background:#f490d3;border-radius:3px}
.auth-story h1{max-width:580px;margin:76px 0 22px;font-size:clamp(3.4rem,5.1vw,5.6rem);line-height:1.02;letter-spacing:-.055em;font-weight:850}
.auth-story h1 span{display:block;color:#f5a6d7}
.auth-story-inner>p:not(.auth-kicker){max-width:430px;margin:0;font-size:1.06rem;line-height:1.7;color:#e9e8f6}
.auth-story-bottom{margin-top:auto;padding-top:80px;display:flex;align-items:center;gap:16px;color:#e5dff0;font-size:.9rem}
.auth-story-mark{display:grid;place-items:center;width:48px;height:48px;border:1px solid #ffffff56;border-radius:15px;font-size:.79rem;font-weight:900;letter-spacing:-.06em;color:#fff}
.auth-card{display:flex;align-items:center;justify-content:center;border:1px solid var(--auth-border);border-left:0;border-radius:0 28px 28px 0;background:var(--auth-panel);box-shadow:var(--auth-shadow);min-height:620px}
.auth-card-inner{width:min(100%,540px);padding:clamp(30px,4.3vw,64px)}
.auth-mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:5px;margin-bottom:36px;border-radius:14px;background:var(--auth-surface)}
.auth-mode-switch button{min-height:44px;border:0;border-radius:10px;background:transparent;color:var(--auth-muted);font-size:.91rem;font-weight:750}
.auth-mode-switch button[aria-pressed="true"]{background:var(--auth-panel);box-shadow:0 2px 12px #0002;color:var(--auth-text)}
.auth-eyebrow{margin:0 0 7px;color:var(--auth-accent);font-size:.78rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.auth-heading h2{margin:0;font-size:clamp(1.95rem,2.5vw,2.65rem);line-height:1.14;letter-spacing:-.04em}
.auth-heading>p:last-child{margin:11px 0 30px;color:var(--auth-muted)}
.auth-providers{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.auth-provider{min-height:52px;display:flex;align-items:center;justify-content:center;gap:10px;padding:8px 12px;text-decoration:none;text-align:center;background:var(--auth-surface);border:1px solid var(--auth-border);border-radius:12px;font-size:.87rem;font-weight:750;line-height:1.2;transition:transform .16s ease,border-color .16s ease,background .16s ease}
.auth-provider:hover{transform:translateY(-2px);border-color:var(--auth-blue)}
.auth-provider svg{width:22px;height:22px;flex:none;fill:currentColor}
.auth-divider{display:flex;align-items:center;gap:14px;margin:26px 0;color:var(--auth-muted);font-size:.82rem;white-space:nowrap}
.auth-divider::before,.auth-divider::after{content:"";height:1px;flex:1;background:var(--auth-border)}
.auth-providers:not(:has(.auth-provider:not([hidden]))),
.auth-providers:not(:has(.auth-provider:not([hidden])))+.auth-divider,
.auth-register-provider:not(:has(.auth-provider:not([hidden]))){display:none}
.auth-field{margin-bottom:19px}
.auth-field label,.auth-step label{display:block;margin-bottom:8px;font-size:.9rem;font-weight:750}
.auth-field input,.auth-step input{display:block;width:100%;min-height:52px;padding:12px 15px;border:1px solid var(--auth-border);border-radius:11px;color:var(--auth-text);background:var(--auth-input);outline:0;transition:border-color .15s,box-shadow .15s}
.auth-field input:focus,.auth-step input:focus{border:2px solid var(--auth-blue);box-shadow:none}
.auth-field input::placeholder,.auth-step input::placeholder{color:var(--auth-muted);opacity:.8}
.auth-field input[aria-invalid="true"],.auth-step input[aria-invalid="true"]{border-color:var(--auth-error)}
.auth-password-wrap{position:relative}
.auth-password-wrap input{padding-right:76px}
.auth-reveal{position:absolute;right:6px;top:6px;min-width:60px;min-height:40px;padding:0 8px;border:0;border-radius:8px;background:transparent;color:var(--auth-blue);font-size:.82rem;font-weight:800}
.auth-reveal:hover{background:var(--auth-surface)}
.auth-field-error{display:block;min-height:0;color:var(--auth-error);font-size:.81rem;line-height:1.4}
.auth-field-error:not(:empty){margin-top:6px}
.auth-primary{width:100%;min-height:53px;display:flex;align-items:center;justify-content:center;gap:12px;border:1px solid transparent;border-radius:11px;background:linear-gradient(105deg,#cc2b9b,#8055df 60%,#5675dd);color:#fff;font-size:.95rem;font-weight:800;text-decoration:none;box-shadow:0 8px 22px #8d3fcc33;transition:filter .16s,transform .16s}
.auth-primary:not(:disabled):hover{filter:brightness(1.09);transform:translateY(-2px)}
.auth-primary:disabled{background:var(--auth-surface);border-color:var(--auth-border);box-shadow:none;color:var(--auth-muted)}
.auth-primary span{font-size:1.25rem;line-height:1}
.auth-availability{margin:12px 0 0;color:var(--auth-muted);font-size:.82rem;line-height:1.5}
.auth-response{margin:15px 0 0;padding:12px 14px;border:1px solid var(--auth-border);border-radius:10px;background:var(--auth-surface);font-size:.9rem}
.auth-footnote{margin:28px 0 0;text-align:center;color:var(--auth-muted);font-size:.88rem}
.auth-footnote button{padding:3px;border:0;background:none;color:var(--auth-blue);font-size:inherit;font-weight:800}
.auth-footnote button:hover{text-decoration:underline}
.auth-reset-actions{display:grid;gap:14px;margin-top:24px;text-align:center}
.auth-reset-secondary,.auth-reset-support{justify-self:center;padding:4px;border:0;background:none;color:var(--auth-blue);font-size:.88rem;font-weight:800;text-underline-offset:3px}
.auth-reset-secondary:hover,.auth-reset-support:hover{text-decoration:underline}
.auth-progress{margin:0 0 32px}
.auth-progress-track{height:6px;overflow:hidden;border-radius:5px;background:var(--auth-surface)}
.auth-progress-track span{display:block;width:25%;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--auth-accent),var(--auth-blue));transition:width .38s ease}
.auth-progress p{display:flex;justify-content:space-between;gap:12px;margin:9px 0 0;color:var(--auth-muted);font-size:.81rem;font-weight:700}
.auth-step-window{position:relative;min-height:175px;overflow:hidden}
.auth-step{width:100%}
.auth-step label{margin:0 0 5px;font-size:1.08rem}
.auth-step-note{margin:0 0 18px;color:var(--auth-muted);font-size:.87rem}
.auth-step-actions{display:flex;gap:12px;align-items:center}
.auth-step-actions .auth-primary{width:auto;flex:1}
.auth-back{min-width:91px;min-height:53px;border:1px solid var(--auth-border);border-radius:11px;background:var(--auth-surface);color:var(--auth-text);font-size:.9rem;font-weight:750}
.auth-back:hover{border-color:var(--auth-blue)}
.auth-password-guide{margin:10px 0 0;color:var(--auth-muted);font-size:.79rem;line-height:1.5}
.auth-register-provider{margin-top:26px;padding-top:23px;border-top:1px solid var(--auth-border)}
.auth-register-provider>p{margin:0 0 12px;text-align:center;color:var(--auth-muted);font-size:.85rem}
.auth-providers-compact .auth-provider{min-height:46px}
.auth-enter-forward{animation:auth-enter-forward .3s cubic-bezier(.2,.8,.2,1) both}
.auth-enter-backward{animation:auth-enter-backward .3s cubic-bezier(.2,.8,.2,1) both}
@keyframes auth-enter-forward{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}
@keyframes auth-enter-backward{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}
@media(max-width:980px){.auth-main{grid-template-columns:minmax(0,.78fr) minmax(400px,1fr);padding-inline:22px}.auth-story-inner{padding:40px}.auth-story h1{font-size:clamp(2.8rem,5vw,4.4rem)}}
@media(max-width:760px){.auth-header{padding:15px 22px}.auth-main{display:block;min-height:0;padding:12px 18px 35px}.auth-story{min-height:0;border-radius:20px 20px 0 0}.auth-story::after{right:-100px;bottom:-270px}.auth-story-inner{padding:25px 28px 26px}.auth-kicker{font-size:.7rem}.auth-story h1{margin:26px 0 10px;font-size:clamp(2.35rem,8vw,3.3rem)}.auth-story h1 span{display:inline}.auth-story-inner>p:not(.auth-kicker){font-size:.9rem;line-height:1.55}.auth-story-bottom{display:none}.auth-card{min-height:0;border:1px solid var(--auth-border);border-top:0;border-radius:0 0 20px 20px}.auth-card-inner{max-width:540px;padding:27px 27px 31px}.auth-mode-switch{margin-bottom:28px}}
@media(max-width:420px){.auth-header{padding-inline:18px}.auth-brand{max-width:140px}.auth-exit{font-size:.8rem}.auth-main{padding-inline:12px}.auth-story-inner{padding-inline:23px}.auth-card-inner{padding:23px 20px 27px}.auth-providers{gap:8px}.auth-provider{font-size:.77rem;padding:8px}.auth-provider svg{width:19px;height:19px}.auth-heading h2{font-size:1.94rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}.auth-enter-forward,.auth-enter-backward{animation:none}}
