:root{color-scheme:light;--ink:#171a1e;--muted:#657080;--line:#dcdedc;--brand:#2457d6;--brand-dark:#173f9e;--soft:#eef2ff;--night:#11161d;--danger:#b93f3a}
*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;color:var(--ink);font:14px/1.45 "IBM Plex Sans","Segoe UI Variable","Segoe UI",ui-sans-serif,sans-serif;background:#f4f1ea}button,input,textarea{font:inherit}.hidden{display:none!important}
.auth-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(390px,.7fr)}
.story{position:relative;min-height:100vh;padding:42px clamp(34px,5vw,76px);overflow:hidden;color:#f7f8fb;background:radial-gradient(circle at 19% 12%,rgba(62,104,222,.28),transparent 28%),radial-gradient(circle at 74% 77%,rgba(59,138,111,.15),transparent 32%),linear-gradient(145deg,#181e27 0%,#11161d 58%,#0c1117 100%)}
.story:before{content:"";position:absolute;inset:0;opacity:.32;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:52px 52px;mask-image:linear-gradient(to bottom,#000,transparent 82%)}
.story-brand,.mobile-brand{position:relative;display:flex;align-items:center;gap:12px;z-index:2}.story-brand img,.mobile-brand img{width:40px;height:40px;padding:5px;object-fit:contain;border-radius:12px;background:#f8f6f0}.story-brand strong{display:block;font-size:16px;letter-spacing:.12em}.story-brand span{display:block;margin-top:2px;color:#aab3c0;font-size:10px;letter-spacing:.06em}
.story-copy{position:relative;z-index:2;max-width:670px;margin-top:clamp(420px,57vh,610px)}.eyebrow,.kicker{margin:0 0 12px;color:#83a1ff;font-size:10px;font-weight:850;letter-spacing:.16em;text-transform:uppercase}.story h1{margin:0;font:600 clamp(42px,5.2vw,76px)/.98 "Segoe UI Variable","Segoe UI",sans-serif;letter-spacing:-.055em}.story h1 em{color:#9ab1f8;font-style:normal}.story-copy>p:last-child{max-width:560px;margin:24px 0 0;color:#aeb7c4;font-size:16px;line-height:1.65}
.flow{position:absolute;inset:100px 3vw auto;z-index:1;height:min(44vh,430px)}.flow svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.flow-shadow,.flow-line{fill:none;stroke-linecap:round}.flow-shadow{stroke:rgba(36,87,214,.15);stroke-width:24;filter:blur(11px)}.flow-line{stroke:url(#none);stroke:#4f75e4;stroke-width:2;stroke-dasharray:10 12;animation:dash 11s linear infinite;filter:drop-shadow(0 0 9px rgba(88,126,235,.7))}@keyframes dash{to{stroke-dashoffset:-220}}
.flow-node{position:absolute;width:132px;padding:13px 14px;border:1px solid rgba(255,255,255,.13);border-radius:16px;background:rgba(20,27,36,.82);box-shadow:0 18px 40px rgba(0,0,0,.25);backdrop-filter:blur(13px);animation:float 5.2s ease-in-out infinite}.flow-node span{display:block;color:#7897ef;font-size:9px;font-weight:800}.flow-node strong{display:block;margin-top:3px;font-size:14px}.flow-node small{display:block;margin-top:4px;color:#8e99a8;font-size:9px}.n1{left:2%;top:61%}.n2{left:29%;top:32%;animation-delay:-1.2s}.n3{left:57%;top:48%;animation-delay:-2.5s}.n4{right:1%;top:8%;animation-delay:-3.6s}@keyframes float{50%{transform:translateY(-8px)}}
.particle{position:absolute;width:8px;height:8px;border-radius:50%;background:#9bb4ff;box-shadow:0 0 0 6px rgba(95,132,238,.12),0 0 22px #6d90f2;animation:pulse 2.5s ease-in-out infinite}.p1{left:22%;top:46%}.p2{left:49%;top:47%;animation-delay:-.8s}.p3{right:16%;top:24%;animation-delay:-1.5s}@keyframes pulse{50%{transform:scale(1.7);opacity:.55}}
.trust-row{position:absolute;left:clamp(34px,5vw,76px);right:clamp(34px,5vw,76px);bottom:34px;z-index:2;display:flex;gap:24px;color:#7f8997;font-size:10px}.trust-row span{display:flex;align-items:center;gap:7px}.trust-row i,.auth-status i{width:7px;height:7px;border-radius:50%;background:#4eb889;box-shadow:0 0 0 4px rgba(78,184,137,.11)}
.auth-panel{min-height:100vh;padding:42px clamp(25px,4vw,72px);display:grid;place-items:center;background:radial-gradient(circle at 100% 0,rgba(36,87,214,.08),transparent 28%),#f4f1ea}.auth-card{width:min(470px,100%);padding:44px 42px 30px;border:1px solid rgba(255,255,255,.9);border-radius:24px;background:rgba(255,254,250,.94);box-shadow:0 32px 90px rgba(23,26,30,.1);backdrop-filter:blur(18px)}.mobile-brand{display:none;margin-bottom:30px}.mobile-brand strong{letter-spacing:.1em}.kicker{color:var(--brand)}.auth-card h2{margin:0;font-size:34px;line-height:1;letter-spacing:-.045em}.lead{margin:13px 0 28px;color:var(--muted);font-size:13px}.field{display:block;margin:15px 0 0}.field>span:first-child{display:block;margin-bottom:7px;color:#3f4a59;font-size:11px;font-weight:760}.field input,.field textarea{width:100%;padding:0 14px;border:1px solid var(--line);border-radius:11px;background:#fbfcfa;color:var(--ink);transition:.18s}.field input{height:48px}.field textarea{min-height:104px;padding-top:12px;padding-bottom:12px;line-height:1.45;resize:vertical}.field input:focus,.field textarea:focus{outline:0;border-color:var(--brand);background:#fff;box-shadow:0 0 0 4px rgba(36,87,214,.11)}.field-help{display:block;margin-top:7px;color:#838c98;font-size:10px;line-height:1.45}.password-wrap{position:relative;display:block}.password-wrap input{padding-right:82px}.password-toggle{position:absolute;right:7px;top:7px;min-width:72px;height:34px;padding:0 9px;border:0;border-radius:8px;color:#667185;background:transparent;font-size:10px;font-weight:750;cursor:pointer}.password-toggle:hover{color:var(--brand);background:var(--soft)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-error{min-height:19px;margin:11px 0 -3px;color:var(--danger);font-size:11px}.submit{width:100%;height:50px;margin-top:16px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;border:0;border-radius:11px;color:#fff;background:linear-gradient(135deg,#2c61e6,#1b47b4);box-shadow:0 13px 28px rgba(36,87,214,.22);font-weight:800;cursor:pointer;transition:.18s}.submit:hover{transform:translateY(-1px);box-shadow:0 17px 34px rgba(36,87,214,.29)}.submit:disabled{cursor:wait;opacity:.65;transform:none}.submit b{font-size:19px;font-weight:400}.auth-note{margin:15px 20px 0;color:#8a929c;font-size:10px;line-height:1.5;text-align:center}.auth-status{margin-top:28px;padding-top:18px;display:flex;align-items:center;justify-content:center;gap:8px;border-top:1px solid var(--line);color:#7d8692;font-size:10px}.password-meter{margin:9px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:5px;align-items:center}.password-meter i{height:3px;border-radius:10px;background:#dadddf}.password-meter small{grid-column:1/-1;color:#8b939d;font-size:9px}.password-meter.level-1 i:nth-child(1),.password-meter.level-2 i:nth-child(-n+2),.password-meter.level-3 i{background:#5279e5}
@media(max-width:980px){.auth-shell{grid-template-columns:1fr}.story{display:none}.auth-panel{padding:24px}.mobile-brand{display:flex}.auth-card{padding:34px 30px 26px}}
@media(max-width:540px){.auth-panel{padding:12px}.auth-card{padding:28px 20px 24px;border-radius:18px}.auth-card h2{font-size:29px}.form-grid{grid-template-columns:1fr;gap:0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}.submit{transition:none}}