:root{color-scheme:dark;font-family:Inter,"Segoe UI",Arial,sans-serif;color:#edf2fa;background:#0d1422;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100svh;display:grid;place-items:center;padding:40px 24px;background:radial-gradient(ellipse at 50% 5%,#16244177,transparent 60%),#0d1422}.login{width:100%;max-width:330px;padding-bottom:30px}.brand{display:inline-block;color:#f0f4fc;text-decoration:none;font-size:26px;font-weight:700;letter-spacing:-1.1px;margin-bottom:44px}.brand span{color:#4c8dff}h1{font-size:19px;letter-spacing:-.4px;font-weight:500;margin:0 0 28px}label{display:block;font-size:12px;color:#aab8cd;margin:0 0 9px}input,button{font:inherit}input{width:100%;height:49px;padding:0 14px;border:1px solid #2a374c;background:#131e2e;border-radius:7px;color:#edf2fa;font-size:13px;outline:none;transition:border-color .2s,box-shadow .2s}input::placeholder{color:#63748e}input:focus{border-color:#528af0;box-shadow:0 0 0 3px #3778e914}#email{margin-bottom:23px}.password-field{position:relative}.password-field input{padding-right:46px}#toggle-password{position:absolute;right:5px;top:5px;width:39px;height:39px;display:grid;place-items:center;color:#8193ae;background:transparent;border:0;border-radius:5px;cursor:pointer}#toggle-password:hover{color:#d8e5fb}svg{width:18px;height:18px}.submit{margin-top:28px;width:100%;height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 15px;background:#2b6aeb;border:1px solid #3779f4;border-radius:7px;color:white;font-size:13px;font-weight:500;cursor:pointer;transition:background .2s}.submit:hover{background:#397af4}.submit span{font-size:19px}.submit:disabled{opacity:.6;cursor:wait}#message{font-size:12px;line-height:1.7;color:#a9c9ff;margin:16px 0 0}#message:empty{display:none}button:focus-visible,a:focus-visible{outline:2px solid #75a6ff;outline-offset:4px}@media(max-width:480px){.login{padding-bottom:45px}.brand{margin-bottom:38px}}
/* Large, quiet background sculpture. */
body{position:relative;isolation:isolate;overflow-x:hidden;background:radial-gradient(ellipse at 15% 45%,#18397844,transparent 55%),#0b1220}
body::before{content:'';position:fixed;z-index:-2;width:clamp(620px,78vw,1200px);aspect-ratio:1;border-radius:50%;left:-28vw;top:50%;transform:translateY(-50%) rotate(-25deg);border:clamp(70px,10vw,155px) solid #2463c54d;background:transparent;box-shadow:inset 12px 7px 35px #66a6ff44,inset -22px -18px 50px #071328aa,18px 12px 75px #2565d326,-12px -8px 50px #4284e922;pointer-events:none}
body::after{content:'';position:fixed;z-index:-1;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 5%,#0b122044 40%,#0b1220ed 72%),radial-gradient(ellipse at 7% 15%,#437ff51c,transparent 50%)}
.login{position:relative;margin-left:34vw;max-width:340px;padding:35px 0}
.brand{font-size:29px;margin-bottom:48px}
h1{font-size:21px;margin-bottom:30px}
input{background:#111d2cb3;backdrop-filter:blur(16px);border-color:#30415b}
@media(min-width:1600px){.login{margin-left:29vw}}
@media(max-width:850px){.login{margin-left:18vw}body::before{left:-55vw}body::after{background:linear-gradient(90deg,#0b122022,#0b1220c9 75%)}}
@media(max-width:560px){.login{margin-left:0;padding:40px 0}body::before{width:700px;left:-430px;top:22%;border-width:90px;opacity:.55}body::after{background:linear-gradient(180deg,#0b122022,#0b1220d9 58%)}input{background:#101b2be6}}
/* Decorative code scene, never part of the authentication interface. */
body::before{width:900px;left:-420px;opacity:.3;border-width:105px}body::after{background:linear-gradient(90deg,#0b122000 15%,#0b122033 45%,#0b1220eb 77%)}
.code-scene{position:fixed;left:max(4vw,calc((100vw - 1450px)/2));top:50%;width:52vw;max-width:760px;height:540px;transform:translateY(-50%);z-index:-1;pointer-events:none;perspective:1200px}
.code-window{position:absolute;left:0;top:65px;width:600px;max-width:100%;border:1px solid #5687cb36;border-radius:15px;background:linear-gradient(125deg,#17253dcc,#0d192bd9);box-shadow:0 35px 100px #0005,0 0 90px #2362c512;transform:rotateY(14deg) rotateZ(-6deg);overflow:hidden;backdrop-filter:blur(15px)}
.code-toolbar{height:49px;padding:0 19px;display:flex;align-items:center;gap:7px;border-bottom:1px solid #5379b322;background:#ffffff02}.code-toolbar>span{width:7px;height:7px;border-radius:50%;background:#59749b66}.code-toolbar>span:first-child{background:#679af488}.code-toolbar b{font:10px "Cascadia Code",Consolas,monospace;color:#7f96b9;font-weight:400;margin-left:13px}.code-toolbar em{font:9px Consolas,monospace;margin-left:auto;color:#83a9dd;background:#2d65b333;padding:4px;border-radius:3px}.code-content{padding:24px 23px 26px;font:12px/2.2 "Cascadia Code",Consolas,monospace;color:#a9bbd6;white-space:pre}.code-content>div{height:26px}.line{display:inline-block;width:37px;color:#425879;font-size:10px;user-select:none}.purple{color:#ae9be7}.cyan{color:#6fc7d4}.blue{color:#7baaff}.comment{color:#5a7397}.cursor{color:#73a9ff}.code-status{border-top:1px solid #5379b322;padding:12px 19px;display:flex;justify-content:space-between;font:9px Consolas,monospace;color:#6c86ac}.code-status>span:last-child{color:#75b0b4}.floating-code{position:absolute;bottom:16px;right:75px;font:100px Consolas,monospace;font-weight:700;letter-spacing:-16px;color:#639bff17;transform:rotate(-8deg)}.network{position:absolute;inset:0;background:radial-gradient(ellipse at 40% 55%,#2168e01a,transparent 65%)}.network:before,.network:after{content:'';position:absolute;width:400px;height:250px;left:80px;top:15px;border:1px solid #5089e325;border-radius:50%;transform:rotate(-30deg)}.network:after{transform:rotate(40deg);top:200px;left:170px}.network i{position:absolute;width:5px;height:5px;border-radius:50%;background:#71a4ff;box-shadow:0 0 15px #467de9}.network i:nth-child(1){left:80px;top:125px}.network i:nth-child(2){left:390px;top:15px}.network i:nth-child(3){left:520px;top:370px}.network i:nth-child(4){left:280px;top:490px}.network i:nth-child(5){left:15px;top:360px}
.login{margin-left:55vw}
@media(min-width:1600px){.login{margin-left:48vw}}
@media(max-width:1100px){.code-scene{left:-120px;width:650px;opacity:.65}.login{margin-left:48vw}.code-window{width:540px}.code-content{font-size:10px}}
@media(max-width:800px){.code-scene{left:-240px;opacity:.3}.login{margin-left:25vw}body::after{background:linear-gradient(90deg,#0b122033,#0b1220cc 70%)}}
@media(max-width:560px){.login{margin-left:0}.code-scene{left:-130px;top:0;transform:translateY(-180px) scale(.8);opacity:.2;width:600px;max-width:none}.code-window{transform:rotate(-12deg)}.floating-code{display:none}body::after{background:linear-gradient(180deg,#0b122033,#0b1220ed 40%)}body::before{opacity:.12}}
/* Graphite / violet / mint palette. */
:root{background:#101016;color:#eeedf6}body{background:radial-gradient(ellipse at 16% 45%,#59379125,transparent 56%),#101016}body::before{border-color:#8053c52b;box-shadow:inset 12px 7px 35px #b38cff2b,inset -22px -18px 50px #120d22aa,18px 12px 75px #844cba1c,-12px -8px 50px #64d9bf0d}body::after{background:linear-gradient(90deg,#10101600 15%,#10101633 45%,#101016eb 77%)}
.brand{font-size:28px;letter-spacing:-1.2px;margin-bottom:42px;color:#f1eff9}.brand span{color:#a58aff}h1{font-size:22px;font-weight:500;letter-spacing:-.6px;margin-bottom:31px}.login{max-width:350px}.login:before{content:'';position:absolute;left:-27px;top:94px;width:2px;height:40px;border-radius:2px;background:linear-gradient(#b79aff,#70d9c2);opacity:.7}label{font-size:11px;letter-spacing:.2px;color:#a9a6bc}input{height:53px;border-radius:9px;border-color:#353140;background:#1a1823a6;color:#f1eff9;padding-left:16px;box-shadow:inset 0 1px 0 #ffffff03}input::placeholder{color:#6e697e}input:hover{border-color:#4b435e}input:focus{border-color:#a68ae3;box-shadow:0 0 0 3px #9a71e414;background:#1d1929}#email{margin-bottom:24px}.password-field input{padding-right:49px}#toggle-password{top:7px;right:7px;color:#8b809f}#toggle-password:hover{color:#d2bcfc}.submit{height:51px;margin-top:31px;padding:0 17px;border-radius:9px;background:#ac91e8;border:1px solid #c1a9f0;color:#1b132a;font-weight:650;box-shadow:0 5px 24px #9a6ce616;transition:background .2s,box-shadow .2s,transform .2s}.submit:hover{background:#bda3f4;box-shadow:0 6px 30px #9a6ce626;transform:translateY(-1px)}.submit:active{transform:translateY(0)}.submit span{font-size:20px;font-weight:400}#message{color:#c8b8eb}button:focus-visible,a:focus-visible{outline-color:#bba0f1}
.code-window{border-color:#a38bc32d;background:linear-gradient(125deg,#272033cc,#171620e6);box-shadow:0 35px 100px #0005,0 0 90px #7953a510}.code-toolbar{border-color:#a185c31c;background:#ffffff02}.code-toolbar>span{background:#887b9c66}.code-toolbar>span:first-child{background:#b19ae188}.code-toolbar>span:nth-child(2){background:#8ad3c566}.code-toolbar b{color:#9a88ad}.code-toolbar em{color:#b9a0da;background:#8b61b922}.code-content{color:#bfb4ce}.line{color:#5d4f70}.purple{color:#bc9aee}.cyan{color:#7ddbc4}.blue{color:#e0b489}.comment{color:#7d6d8e}.cursor{color:#83dfc7}.code-status{border-color:#a185c31c;color:#93809e}.code-status>span:last-child{color:#83c9b8}.floating-code{color:#ae8bd71b}.network{background:radial-gradient(ellipse at 40% 55%,#8d53d015,transparent 65%)}.network:before,.network:after{border-color:#b190e020}.network i{background:#92dbc9;box-shadow:0 0 17px #7bd3b988}.network i:nth-child(2),.network i:nth-child(4){background:#b093e8;box-shadow:0 0 17px #a17bda88}
@media(max-width:800px){body::after{background:linear-gradient(90deg,#10101633,#101016cc 70%)}}
@media(max-width:560px){body::after{background:linear-gradient(180deg,#10101633,#101016ed 40%)}.login{max-width:330px}.login:before{display:none}.brand{margin-bottom:39px}}
@media(prefers-reduced-motion:reduce){.submit{transition:none}.submit:hover{transform:none}}
/* Refined login column; background and code scene stay unchanged. */
.login{max-width:360px;padding-top:42px;padding-bottom:42px}.login:before{display:none}.brand{font-size:25px;letter-spacing:-1px;margin-bottom:49px}.brand span{display:inline-block;margin-left:2px}h1{font-size:32px;line-height:1.2;font-weight:550;letter-spacing:-1.2px;margin:0 0 35px}.login form{position:relative}label{font-size:11px;font-weight:500;letter-spacing:.3px;color:#bbb1ca;margin-bottom:11px}input{height:55px;padding-left:43px;border-radius:10px;background-color:#191720b3;border-color:#39313f;background-repeat:no-repeat;background-position:16px center;background-size:16px;color:#eee8f7;font-size:13px;box-shadow:inset 0 1px 0 #ffffff04;transition:border-color .2s,background-color .2s,box-shadow .2s}input::placeholder{color:#786c86;font-size:12px}input:hover{border-color:#574463}input:focus{background-color:#211b2b;border-color:#aa8dd7;box-shadow:0 0 0 3px #af8de80d}#email{margin-bottom:27px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239587a7' stroke-width='1.5'%3E%3Crect x='3' y='5' width='18' height='14' rx='3'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E")}.password-field input{padding-right:49px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239587a7' stroke-width='1.5'%3E%3Crect x='5' y='10' width='14' height='11' rx='3'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3m-4 5v2'/%3E%3C/svg%3E")}#toggle-password{top:8px;right:8px;width:39px;height:39px;border-radius:7px;color:#9582a7}#toggle-password:hover{background:#c6a3eb0b;color:#d6bef0}.submit{margin-top:33px;height:53px;border-radius:10px;padding:0 15px 0 19px;letter-spacing:.1px;background:linear-gradient(105deg,#b49ae8,#a78bdf);border-color:#c4aaee;font-size:13px;box-shadow:inset 0 1px 0 #ffffff22,0 8px 25px #9b73cf12}.submit span{display:grid;place-items:center;width:28px;height:28px;border-radius:7px;background:#24133510;font-size:18px}.submit:hover{background:linear-gradient(105deg,#c3aaf3,#b59ae9);box-shadow:inset 0 1px 0 #ffffff33,0 8px 30px #9b73cf20}.submit:disabled{transform:none}#message{font-size:11px;line-height:1.8;margin-top:20px;padding-left:1px;max-width:340px}@media(max-width:560px){.login{max-width:330px;padding:35px 0}.brand{margin-bottom:40px}h1{font-size:29px;margin-bottom:30px}}
.social-links{display:flex;align-items:center;justify-content:center;gap:30px;margin-top:31px;padding-top:23px;border-top:1px solid #a38bc314}.social-links a{display:inline-flex;align-items:center;gap:8px;color:#9b8da9;font-size:11px;text-decoration:none;transition:color .2s}.social-links a svg{width:16px;height:16px}.social-arrow{font-size:12px;color:#756881;margin-left:1px}.social-links a[href]:hover,.social-links a[href]:hover .social-arrow{color:#d2b8f6}.social-links a[aria-disabled=true]{opacity:.5;cursor:default}.social-links a:focus-visible{outline:2px solid #bba0f1;outline-offset:6px;border-radius:3px}
/* Keep field icons at a fixed size, including browser autofill. */
#email,.password-field input{background-repeat:no-repeat;background-size:16px 16px;background-position:16px center;padding-left:43px}
input:-webkit-autofill{-webkit-text-fill-color:#eee8f7;caret-color:#eee8f7;transition:background-color 99999s ease-out 0s}
/* Mobile login: readable text, touch-sized controls and a quiet code backdrop. */
@media(max-width:650px){
 body{padding:30px 25px;min-height:100svh;place-items:center}
 .login{width:100%;max-width:360px;margin-left:0;padding:30px 0}
 .login:before{display:none}
 .brand{font-size:26px;margin-bottom:39px}
 h1{font-size:30px;margin-bottom:29px}
 label{font-size:12px;margin-bottom:10px}
 input{font-size:16px;height:55px;border-radius:10px}
 input::placeholder{font-size:13px}
 #email{margin-bottom:25px}
 #toggle-password{width:44px;height:44px;top:5px;right:4px}
 .password-field input{padding-right:53px}
 .submit{height:53px;font-size:14px;margin-top:29px}
 .social-links{margin-top:26px;padding-top:18px;gap:25px}
 .social-links a{min-height:44px;font-size:12px;gap:9px}
 .social-links a svg{width:18px;height:18px}
 .code-scene{left:-160px;top:0;transform:translateY(-210px) scale(.8);opacity:.19;width:600px;max-width:none}
 .code-window{transform:rotate(-12deg)}
 .floating-code{display:none}
 body::before{opacity:.12}
 body::after{background:linear-gradient(180deg,#10101644,#101016ee 42%)}
}
@media(max-width:360px){body{padding:24px 20px}.brand{margin-bottom:30px}.login{padding:15px 0}h1{font-size:27px}.social-links{gap:22px}}
@media(max-height:650px) and (max-width:650px){body{place-items:start center;padding-top:20px;padding-bottom:20px}.login{padding:15px 0}.brand{margin-bottom:25px}h1{margin-bottom:23px}.social-links{margin-top:20px;padding-top:12px}}
/* Icons are independent of the input background and autofill styling. */
.email-field,.password-field{position:relative}.email-field{margin-bottom:27px}#email{margin-bottom:0}#email,.password-field input{background-image:none}.field-icon{position:absolute;left:16px;top:19px;width:16px;height:16px;z-index:2;color:#9587a7;pointer-events:none}.email-field:focus-within .field-icon,.password-field:focus-within .field-icon{color:#c7a9ed}
@media(max-width:650px){.email-field{margin-bottom:25px}#email{margin-bottom:0}}