
:root{color-scheme:dark;--fg:#f3f7ff;--muted:#b4c1d4;--panel:#070e1cbd;--field:#c1d9ff0d;--line:#b8d7ff4a;--shadow:#000b2670;--blue:#21aaff;--icon:#f0f5ff;--form-size:420px}*{box-sizing:border-box}body{margin:0;min-height:100svh;background:#020b18;color:var(--fg);font:14px 'Segoe UI',Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{color:inherit;cursor:pointer}button,input,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:2px solid #43baff;outline-offset:4px}button:disabled{cursor:wait}button svg{pointer-events:none}[hidden]{display:none!important}.backgrounds{position:fixed;inset:0;overflow:hidden;z-index:-2;background:#031024}.backdrop{position:absolute;inset:0;background:center center/cover no-repeat;transition:opacity .5s ease;will-change:opacity}.backdrop.dark{background-image:url('../img/dark-courtyard.png')}.backdrop.light{background-image:url('../img/light-courtyard.png');opacity:0}.backgrounds:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,#00071714 50%,transparent 75%);pointer-events:none}.atmosphere{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 50% 45%,transparent 30%,#0007121c);overflow:hidden}.spark{position:absolute;left:var(--x);top:var(--y);width:2px;height:2px;border-radius:50%;background:#ffe0a0;box-shadow:0 0 7px 2px #ffce7c50;animation:float 8s var(--d) ease-in-out infinite;opacity:.5}.layout{min-height:100svh;max-width:1600px;margin:auto;display:flex;flex-direction:column;align-items:center;padding:48px 26px 22px;position:relative}.tools{position:absolute;right:30px;top:24px;display:flex;align-items:center;gap:9px;z-index:5}.languages,.themes{display:flex;align-items:center;background:#c9def216;border:1px solid #deedff21;border-radius:26px;padding:4px;backdrop-filter:blur(16px)}.languages button{font-size:10px;letter-spacing:.02em;background:none;border:0;padding:5px;color:var(--muted)}.languages button.active{color:var(--fg)}.themes button{width:32px;height:29px;border:0;background:none;border-radius:50%;display:grid;place-items:center}.themes svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6}.themes button.active{background:#0068e95e;color:#fff;box-shadow:0 0 16px #006cff5e}.brands{display:flex;align-items:center;justify-content:center;gap:28px;margin:12px 0 37px;min-height:78px;text-align:center}.bekani{font:34px/1 Georgia,'Times New Roman',serif;letter-spacing:.025em;color:#acd4f8;text-shadow:0 1px 0 #fff2}.bekani small{display:block;font:12px/1.8 'Segoe UI',Arial,sans-serif;letter-spacing:.15em}.bekani .est{display:flex;align-items:center;justify-content:center;gap:6px;font:8px 'Segoe UI',Arial,sans-serif;letter-spacing:.1em;color:#bfd8ed;margin-top:3px}.est:before,.est:after{content:'';width:28px;height:1px;background:#96c6ec66}.cross{font:34px/1 'Segoe UI',Arial,sans-serif;font-weight:200;color:#e1edf8}.ferrero{font:bold 34px/1 Georgia,'Times New Roman',serif;letter-spacing:-.025em;background:linear-gradient(#fff0bd 10%,#c99342 38%,#ffe5a3 51%,#a26a2e 80%,#efcc7e);color:transparent;background-clip:text;-webkit-background-clip:text;filter:drop-shadow(0 2px 1px #0004)}main{width:100%;display:flex;flex-direction:column;align-items:center;flex:1;justify-content:center;gap:28px}.auth-shell{width:var(--form-size);max-width:100%;position:relative;isolation:isolate;border-radius:42px 42px 32px 32px;box-shadow:0 25px 70px var(--shadow),-2px 0 4px #63c4ff60,inset 0 1px 0 #e1f3ffad;background:linear-gradient(145deg,#5b8ddc50,#0713264a 30%);border:1px solid #94c2ff99;backdrop-filter:blur(19px) saturate(120%);transition:background .3s,border-color .3s}.auth-shell:before{content:'';position:absolute;inset:-2px;border-radius:inherit;pointer-events:none;box-shadow:inset 1px 1px 3px #d9f1ff90,-2px 0 14px #218eff25}.tabs{position:relative;display:flex;height:68px;isolation:isolate;padding:12px 10px 0;overflow:hidden;border-radius:40px 40px 0 0}.tabs:before{content:'';position:absolute;top:14px;left:10px;bottom:-1px;width:calc(50% - 10px);border:1px solid #a4c6ff88;border-bottom:0;border-radius:27px 27px 0 0;background:linear-gradient(155deg,#3675d72e,#18376d05);box-shadow:inset 0 1px 2px #d6edff70;transition:transform .23s cubic-bezier(.2,.8,.2,1);z-index:-1}.tabs.register:before{transform:translateX(100%)}.tab{flex:1;background:none;border:0;color:var(--muted);font-size:16px;font-weight:400}.tab.active{color:var(--fg);text-shadow:0 0 15px #2488ff80}.tab-glow{position:absolute;bottom:0;left:35px;width:calc(50% - 70px);height:2px;background:#6fd6ff;box-shadow:0 0 7px 2px #00a6ff,0 0 22px 4px #007bff;transition:transform .23s cubic-bezier(.2,.8,.2,1)}.tabs.register .tab-glow{transform:translateX(calc(100% + 70px))}.tab-glow:after{content:'';position:absolute;left:49%;top:-2px;width:5px;height:5px;border-radius:50%;background:#efffff;box-shadow:0 0 6px 2px #fff,0 0 15px 5px #44baff}.panel{background:linear-gradient(125deg,#02060d26,#02081555),var(--panel);border-top:1px solid #8aa7c55c;border-radius:22px 22px 31px 31px;padding:37px 32px 25px;position:relative;overflow:hidden;box-shadow:inset 0 1px 0 #ffffff0a;transition:background .3s}.panel:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 0% 100%,#0069e212,transparent 55%)}.panel>*{position:relative;z-index:1}h1{text-align:center;font-size:26px;font-weight:600;letter-spacing:-.045em;margin:0 0 7px;line-height:1.25}.subtitle{text-align:center;font-size:12px;margin:0 0 29px;color:var(--fg);line-height:1.6}.field{display:block;position:relative;margin-bottom:15px}.field-icon{position:absolute;left:16px;top:18px;width:22px;height:22px;pointer-events:none;fill:none;stroke:var(--icon);stroke-width:1.4}.field input{width:100%;height:58px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(110deg,#d9eaff05,#bfdcff0b);color:var(--fg);padding:0 46px 0 53px;font-size:13px;box-shadow:inset 0 1px 2px #ffffff0c;outline:none;transition:border-color .18s,box-shadow .18s}.field input:focus{border-color:#87d1ff;box-shadow:0 0 0 3px #1687ff14}.field input::placeholder{color:var(--muted);opacity:.85}.email-field input{padding-top:0}.domain-hint{font-size:10px;color:var(--muted);position:absolute;left:53px;top:33px;pointer-events:none}.email-field input:placeholder-shown{padding-bottom:18px}.email-field input:not(:placeholder-shown)+.domain-hint{display:none}.eye{position:absolute;right:12px;top:17px;border:0;background:none;width:27px;height:25px;display:grid;place-items:center}.eye svg{width:21px;fill:none;stroke:var(--fg);stroke-width:1.4}.options{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:16px 3px 23px;font-size:11px}.check{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:11px}.check input{width:17px;height:17px;margin:0;accent-color:#008cff}.forgot{background:none;border:0;padding:0;font-size:11px}.forgot:hover{text-decoration:underline}.submit{position:relative;isolation:isolate;overflow:hidden;width:100%;height:57px;display:flex;align-items:center;justify-content:center;gap:13px;background:linear-gradient(115deg,#22caff,#0862d4 38%,#0843a2 73%,#2193ff);border:1px solid #74daff;border-radius:18px;font-size:19px;font-weight:500;color:#fff;box-shadow:inset 0 2px 3px #f0ffff75,inset 0 -2px 3px #71bfff66,0 0 18px #008aff38;transition:transform .18s,box-shadow .18s}.submit:before,.submit:after{content:'';position:absolute;pointer-events:none;width:128%;height:120%;left:-13%;top:12%;border:2px solid #7ed7ff66;border-radius:45%;transform:rotate(-7deg);box-shadow:0 -2px 5px #67cdff70,inset 0 3px 8px #a1e6ff6b;z-index:-1;animation:buttonWater 6s ease-in-out infinite alternate}.submit:after{top:-46%;transform:rotate(7deg);animation-direction:alternate-reverse;opacity:.6}.submit:hover{transform:translateY(-2px);box-shadow:inset 0 2px 3px #fff7,0 0 24px #008bff77}.submit:active{transform:translateY(1px)}.submit svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;transition:transform .18s}.submit:hover svg{transform:translateX(3px)}.submit.loading{font-size:14px}.spinner{width:20px;height:20px;border:2px solid #ffffff40;border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}.submit.success{background:linear-gradient(110deg,#087a82,#087ab8)}.divider{display:flex;align-items:center;gap:12px;font-size:11px;color:var(--muted);margin:22px 0 17px}.divider:before,.divider:after{content:'';flex:1;height:1px;background:var(--line)}.providers{display:flex;justify-content:center;gap:23px}.provider{width:50px;height:50px;display:grid;place-items:center;border-radius:13px;border:1px solid #c6deff30;background:linear-gradient(145deg,#b7d7ff10,#15305908);box-shadow:inset 0 1px 1px #ffffff16;transition:transform .18s,border .18s}.provider:hover{transform:translateY(-3px);border-color:#9ed5ff}.provider svg{width:25px;height:25px}.ms{display:grid;grid-template-columns:1fr 1fr;gap:2px;width:23px;height:23px}.ms i:nth-child(1){background:#f35325}.ms i:nth-child(2){background:#81bc06}.ms i:nth-child(3){background:#05a6f0}.ms i:nth-child(4){background:#ffba08}.google{font-size:31px;font-weight:700;font-family:Arial,sans-serif;background:conic-gradient(#4285f4 0deg 100deg,#34a853 100deg 165deg,#fbbc05 165deg 220deg,#ea4335 220deg 285deg,#4285f4 285deg);background-clip:text;-webkit-background-clip:text;color:transparent;line-height:1}.message{margin:15px 0 0;text-align:center;font-size:11px;line-height:1.55;color:#9dd7ff}.message:empty{display:none}.features{display:flex;justify-content:space-between;width:480px;max-width:100%;gap:20px;text-align:center}.feature{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;line-height:1.25;text-shadow:0 1px 5px #0008}.feature-icon{width:50px;height:50px;border:1px solid #b4d6ff40;border-radius:13px;background:linear-gradient(135deg,#d2edff19,#07152755);backdrop-filter:blur(10px);display:grid;place-items:center;box-shadow:inset 0 1px 1px #ffffff30}.feature-icon svg{width:31px;height:31px;fill:none;stroke:var(--fg);stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}footer{font-size:9px;letter-spacing:.02em;color:var(--muted);text-align:center;margin-top:23px;text-shadow:0 1px 5px #0008}.demo-button{border:0;background:none;color:inherit;font-size:9px;text-decoration:underline;text-underline-offset:2px;padding:0}.demo-button:hover{color:var(--fg)}
html[data-theme=light]{color-scheme:light;--fg:#071d49;--muted:#495a77;--panel:#f2f6fbd4;--field:#ffffff44;--line:#7b94b640;--shadow:#48739322;--icon:#183363}html[data-theme=light] .backdrop.dark{opacity:0}html[data-theme=light] .backdrop.light{opacity:1}html[data-theme=light] .backgrounds{background:#badff7}html[data-theme=light] .atmosphere{background:none}html[data-theme=light] .auth-shell{border-color:#ffffffc9;background:linear-gradient(145deg,#ffffff99,#f8fbff5e);box-shadow:0 25px 70px var(--shadow),inset 0 2px 2px #fff,0 0 3px #fff}html[data-theme=light] .auth-shell:before{box-shadow:inset 1px 1px 3px #fff}html[data-theme=light] .panel{background:linear-gradient(125deg,#fff5,#eef4fb60),var(--panel);border-top-color:#fff9;box-shadow:inset 0 1px 1px #fff}html[data-theme=light] .tabs:before{border-color:#fff;box-shadow:inset 0 1px 2px #fff;background:linear-gradient(#fff9,#ffffff00)}html[data-theme=light] .tab.active{color:#0045d9;text-shadow:none}html[data-theme=light] .tab-glow{background:#079bff;box-shadow:0 0 12px #00aeffbb}html[data-theme=light] .tab-glow:after{box-shadow:0 0 12px 3px #68c7ff;background:#a2e4ff}html[data-theme=light] .bekani{color:#003673;text-shadow:none}html[data-theme=light] .est{color:#254b77}html[data-theme=light] .cross{color:#fff}html[data-theme=light] .themes,html[data-theme=light] .languages{background:#28415e18;border-color:#fff2}html[data-theme=light] .themes button.active{background:#fffc;color:#dc930e;box-shadow:0 0 17px #ffd687}html[data-theme=light] .field input{background:linear-gradient(110deg,#ffffff55,#ffffff33);box-shadow:inset 0 1px 2px #fff9}html[data-theme=light] .provider{background:#ffffffa1;border-color:#6b8bb82b;box-shadow:inset 0 1px 2px #fff}html[data-theme=light] .feature{text-shadow:none}html[data-theme=light] .feature-icon{border-color:#ffffff6b;background:#eef9ff8c;box-shadow:inset 0 1px 2px #fff}html[data-theme=light] .feature-icon svg{stroke:#00449b}html[data-theme=light] footer{text-shadow:none}html[data-theme=light] .message{color:#075ea3}html[data-theme=light] .spark{background:#f8d080;box-shadow:0 0 5px #fff}
@keyframes buttonWater{to{transform:translate3d(2px,-5px,0) rotate(4deg) scale(1.04)}}@keyframes float{0%,100%{transform:translateY(0);opacity:0}50%{transform:translateY(-22px);opacity:.8}}@keyframes spin{to{transform:rotate(360deg)}}@media(min-height:1000px){.layout{padding-top:65px;padding-bottom:35px}.brands{margin-bottom:45px}main{justify-content:center;gap:34px}.panel{padding-top:40px;padding-bottom:30px}}@media(max-height:850px) and (min-width:700px){.layout{padding-top:23px;padding-bottom:12px}.brands{margin:0 0 20px;min-height:65px}.bekani{font-size:29px}.ferrero{font-size:30px}main{gap:20px}.tabs{height:58px}.panel{padding:24px 30px 20px}.subtitle{margin-bottom:22px}.field input{height:53px}.field-icon{top:16px}.domain-hint{top:30px}.eye{top:14px}.options{margin-bottom:18px}.submit{height:52px}.divider{margin:17px 0 13px}.provider{height:45px;width:45px}.feature-icon{width:43px;height:43px}.feature{font-size:10px}footer{margin-top:16px}}
@media(max-width:700px){.layout{padding:72px 24px 20px}.tools{right:17px;top:17px}.brands{margin:0 0 30px;gap:21px;min-height:65px}.bekani{font-size:28px}.bekani small{font-size:10px}.ferrero{font-size:28px}.cross{font-size:29px}main{gap:25px;justify-content:flex-start}.auth-shell{--form-size:410px;border-radius:35px 35px 27px 27px}.tabs{height:64px}.panel{padding:32px 26px 25px;border-radius:20px 20px 26px 26px}h1{font-size:25px}.subtitle{font-size:11px;margin-bottom:25px}.features{width:420px;gap:7px}.feature{font-size:10px}.feature-icon{width:46px;height:46px}.feature-icon svg{width:27px;height:27px}.backdrop{background-position:center}.languages button{padding:4px 5px}footer{font-size:8px;max-width:310px;line-height:1.8}.options,.check,.forgot{font-size:10px}.field input{font-size:12px}.domain-hint{font-size:9px}}
@media(max-width:370px){.layout{padding-left:17px;padding-right:17px}.brands{gap:15px}.bekani,.ferrero{font-size:25px}.panel{padding:28px 20px 23px}.tab{font-size:14px}.field input{padding-left:46px}.domain-hint{left:46px;font-size:8px}.field-icon{left:13px;width:20px}.features{gap:5px}.feature{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.spark{display:none}}

html{scrollbar-gutter:stable}/* Liquid tab transition: light travels first, the form follows as one surface. */
.tabs:before{transition:transform .42s cubic-bezier(.22,.85,.25,1),border-radius .42s;transform-origin:50% 100%;border-radius:32px 25px 0 0}.tabs.register:before{border-radius:25px 32px 0 0}.tab{transition:color .18s,text-shadow .25s}.tab-glow{transition:transform .4s cubic-bezier(.22,.85,.25,1)}.panel{isolation:isolate}.liquid-surface{position:absolute!important;z-index:3!important;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none!important;opacity:0}.water-crest{position:absolute;top:-55%;left:-50%;width:90%;height:210%;border-radius:47% 53% 48% 52%;border-right:1px solid #a9e7ff9c;background:linear-gradient(90deg,transparent 55%,#46baff04 78%,#a0e7ff14 96%,#d9f6ff28);box-shadow:4px 0 18px #49baff10,inset -2px 0 3px #ccefff38;transform:rotate(-16deg)}.water-crest.second{left:-56%;width:88%;border-right-color:#5ccaff70;opacity:.5;background:none;box-shadow:inset -1px 0 2px #fff4}.water-caustic{position:absolute;left:6%;right:6%;top:0;height:2px;background:linear-gradient(90deg,transparent,#bcf0ff,#168bff,transparent);box-shadow:0 0 13px #42bcff55;opacity:.7}html[data-theme=light] .water-crest{border-right-color:#ffffffeb;background:linear-gradient(90deg,transparent 55%,#ffffff08 78%,#a5dfff20 96%,#ffffff8c);box-shadow:5px 0 20px #45a8e415,inset -2px 0 3px #fff}html[data-theme=light] .water-crest.second{border-color:#70c8ed75;background:none}.auth-shell,.features{overflow-anchor:none}@media(prefers-reduced-motion:reduce){.liquid-surface{display:none!important}.tabs:before,.tab-glow{transition:none!important}}
