.auth-root{--bg-1:#d8eaf6;--bg-2:#b4d3ec;--paper:#fff;--ink:#0c2c3d;--ink-2:#4a5566;--ink-3:#8a96a4;--line:#0c2c3d1a;--input-bg:#eaedf2;--accent:#29b7d2;--accent-deep:#1a8fa8;--accent-soft:#c7eaf1;--sans-auth:var(--font-roboto),"Roboto",ui-sans-serif,system-ui,sans-serif;font-family:var(--sans-auth);color:var(--ink);-webkit-font-smoothing:antialiased;background:linear-gradient(#d8eef4 0%,#e8f5f7 35%,#f3fafb 70%,#fff 100%);min-height:100vh;font-size:16px;line-height:1.5;position:relative;overflow-x:hidden}.auth-root:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(24% 80% at 6% 92%,#fff 0%,#ffffffeb 35%,#fff0 70%),radial-gradient(18% 60% at 18% 80%,#fff 0%,#ffffffe6 40%,#fff0 72%),radial-gradient(26% 90% at 32% 96%,#fff 0%,#fffffff2 35%,#fff0 70%),radial-gradient(22% 70% at 50% 84%,#fff 0%,#ffffffe6 40%,#fff0 72%),radial-gradient(28% 95% at 64% 98%,#fff 0%,#fffffff2 35%,#fff0 70%),radial-gradient(20% 65% at 80% 82%,#fff 0%,#ffffffe6 40%,#fff0 72%),radial-gradient(24% 80% at 94% 94%,#fff 0%,#ffffffeb 35%,#fff0 70%),linear-gradient(#0000 0%,#fff6 80%,#fffc 100%);height:38vh;position:fixed;bottom:0;left:0;right:0}.auth-root .bg-scatter{pointer-events:none;z-index:1;height:42vh;position:fixed;bottom:0;left:0;right:0}.auth-root .bg-scatter .bs{color:#fff;border-radius:18px;place-items:center;animation:6s ease-in-out infinite auth-bs-bob;display:grid;position:absolute;box-shadow:inset 0 2px #ffffff73,inset 0 -4px 8px #0000001f,0 14px 28px #0c2c3d2e}.auth-root .bg-scatter .bs.round{border-radius:50%}.auth-root .bg-scatter .bs.cyan{background:linear-gradient(135deg,#5cc6d8 0%,#1a8fa8 100%)}.auth-root .bg-scatter .bs.deep{background:linear-gradient(135deg,#2a5a72 0%,#0c2c3d 100%)}.auth-root .bg-scatter .bs.peach{background:linear-gradient(135deg,#ffb56a 0%,#ec6a3c 100%)}.auth-root .bg-scatter .bs.mint{background:linear-gradient(135deg,#5ee3b5 0%,#1f8a6e 100%)}.auth-root .bg-scatter .bs.lilac{background:linear-gradient(135deg,#c290ff 0%,#7e5ad4 100%)}.auth-root .bg-scatter .bs.amber{background:linear-gradient(135deg,#ffd25e 0%,#d88a18 100%)}.auth-root .bg-scatter .bs.rose{background:linear-gradient(135deg,#ff8eb6 0%,#d6427a 100%)}.auth-root .bg-scatter .bs.white{color:#0c2c3d;background:linear-gradient(135deg,#fff 0%,#e8eef4 100%)}.auth-root .bg-scatter .bs.indigo{background:linear-gradient(135deg,#6aa8ff 0%,#2c5fce 100%)}.auth-root .bs-1{width:64px;height:64px;animation-delay:0s;bottom:18%;left:4%;transform:rotate(-8deg)}.auth-root .bs-2{width:52px;height:52px;animation-delay:-.8s;bottom:36%;left:14%;transform:rotate(6deg)}.auth-root .bs-3{width:68px;height:68px;animation-delay:-1.6s;bottom:8%;left:22%;transform:rotate(-4deg)}.auth-root .bs-4{width:58px;height:58px;animation-delay:-2.4s;bottom:24%;left:33%;transform:rotate(8deg)}.auth-root .bs-5{width:60px;height:60px;animation-delay:-3.2s;bottom:6%;left:44%;transform:rotate(-6deg)}.auth-root .bs-6{width:56px;height:56px;animation-delay:-4s;bottom:30%;left:56%;transform:rotate(4deg)}.auth-root .bs-7{width:72px;height:72px;animation-delay:-1.2s;bottom:12%;right:22%;transform:rotate(-10deg)}.auth-root .bs-8{width:54px;height:54px;animation-delay:-2.8s;bottom:32%;right:14%;transform:rotate(6deg)}.auth-root .bs-9{width:62px;height:62px;animation-delay:-3.6s;bottom:18%;right:4%;transform:rotate(-4deg)}.auth-root .bs-10{width:48px;height:48px;animation-delay:-.4s;bottom:38%;right:35%;transform:rotate(10deg)}.auth-root .bg-scatter .dot{background:var(--accent);opacity:.45;border-radius:50%;width:12px;height:12px;position:absolute;box-shadow:0 4px 8px #29b7d240}.auth-root .bg-scatter .dot:first-of-type{background:#ffb56a;bottom:28%;left:11%}.auth-root .bg-scatter .dot:nth-of-type(2){background:#c290ff;bottom:36%;left:38%}.auth-root .bg-scatter .dot:nth-of-type(3){background:#ffd25e;bottom:18%;left:62%}.auth-root .bg-scatter .dot:nth-of-type(4){background:#5ee3b5;bottom:38%;right:28%}.auth-root .bg-scatter .dot:nth-of-type(5){background:#ff8eb6;bottom:38%;right:8%}.auth-root .bg-scatter svg.bs-lines{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}@keyframes auth-bs-bob{0%,to{transform:translateY(0)rotate(var(--r,0deg))}50%{transform:translateY(-6px)rotate(var(--r,0deg))}}.auth-root .bs-1{--r:-8deg}.auth-root .bs-2{--r:6deg}.auth-root .bs-3{--r:-4deg}.auth-root .bs-4{--r:8deg}.auth-root .bs-5{--r:-6deg}.auth-root .bs-6{--r:4deg}.auth-root .bs-7{--r:-10deg}.auth-root .bs-8{--r:6deg}.auth-root .bs-9{--r:-4deg}.auth-root .bs-10{--r:10deg}@media (max-width:720px){.auth-root .bg-scatter{display:none}}.auth-root .auth-page{z-index:2;justify-content:center;align-items:center;min-height:100vh;padding:clamp(20px,4vw,40px) 20px clamp(80px,12vw,160px);display:flex;position:relative}.auth-root .auth-brand-top{z-index:3;align-items:center;gap:12px;margin:0;padding:8px 14px;display:flex;position:absolute;top:clamp(20px,4vw,36px);left:50%;transform:translate(-50%)}.auth-root .auth-brand-mark{color:#fff;letter-spacing:-.04em;background:linear-gradient(#5cc6d8 0%,#1e7a8c 55%,#0c2c3d 100%);border-radius:11px;place-items:center;width:44px;height:44px;font-size:16px;font-weight:800;display:grid;box-shadow:0 6px 14px #0c2c3d24}.auth-root .auth-brand-text .name{letter-spacing:-.02em;color:var(--ink);font-size:18px;font-weight:800;line-height:1.1}.auth-root .auth-brand-text .tag{color:var(--ink-3);letter-spacing:-.005em;margin-top:2px;font-size:12px}.auth-root .auth-back{z-index:10;appearance:none;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);width:40px;height:40px;color:var(--ink);background:#fff9;border:0;border-radius:50%;place-items:center;transition:background .15s,transform .12s;display:grid;position:fixed;top:clamp(16px,3vw,28px);left:clamp(12px,2vw,20px);box-shadow:0 2px 6px #0c2c3d14}.auth-root .auth-back:hover{background:#fff;transform:translateY(-1px)}.auth-root .auth-card{-webkit-backdrop-filter:blur(20px)saturate(140%);background:linear-gradient(#c7eaf1a6 0%,#e8f6f8cc 35%,#fffffff2 100%);border:1px solid #fff9;border-radius:28px;width:100%;max-width:460px;margin:0 auto;padding:clamp(28px,4vw,40px) clamp(24px,4vw,36px) clamp(28px,4vw,36px);position:relative;box-shadow:0 24px 60px #0c2c3d24,0 4px 12px #0c2c3d0f,inset 0 1px #ffffffb3}.auth-root .auth-title{letter-spacing:-.02em;color:var(--ink);text-align:center;margin:0 0 8px;font-size:clamp(22px,2.6vw,26px);font-weight:700;line-height:1.2}.auth-root .auth-sub{color:var(--ink-3);text-align:center;max-width:34ch;margin:0 auto 24px;font-size:14px;line-height:1.5}.auth-root .auth-form,.auth-root .auth-stack{flex-direction:column;gap:12px;display:flex}.auth-root .auth-stack.gap-lg{gap:16px}.auth-root .auth-input{background:#fff;border-radius:10px;align-items:center;height:48px;padding:0 14px;transition:box-shadow .2s,background .2s;display:flex;position:relative;box-shadow:0 2px 6px #0c2c3d0a}.auth-root .auth-input:focus-within{box-shadow:0 0 0 2px var(--accent),0 4px 10px #29b7d21f;background:#fff}.auth-root .auth-input .ic{width:18px;height:18px;color:var(--ink-2);flex-shrink:0;place-items:center;margin-right:10px;display:grid}.auth-root .auth-input input{min-width:0;font:400 14px/1 var(--sans-auth);color:var(--ink);background:0 0;border:0;outline:0;flex:1;padding:14px 0}.auth-root .auth-input input::placeholder{color:var(--ink-3);font-weight:400}.auth-root .auth-input .eye{appearance:none;cursor:pointer;color:var(--ink-2);background:0 0;border:0;place-items:center;padding:6px;display:grid}.auth-root .auth-input .eye:hover{color:var(--ink)}.auth-root .auth-forgot-row{justify-content:flex-end;margin-top:-2px;display:flex}.auth-root .auth-forgot{color:var(--ink-2);cursor:pointer;font-size:13px;font-weight:500;text-decoration:none}.auth-root .auth-forgot:hover{color:var(--accent-deep)}.auth-root .auth-btn{appearance:none;cursor:pointer;font:600 15px/1 var(--sans-auth);white-space:nowrap;border:0;border-radius:10px;justify-content:center;align-items:center;gap:10px;width:100%;height:48px;padding:0 22px;transition:transform .12s,background .15s;display:inline-flex}.auth-root .auth-btn:active{transform:translateY(1px)}.auth-root .auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-root .auth-btn.primary{background:var(--ink);color:#fff}.auth-root .auth-btn.primary:hover:not(:disabled){background:#1c4458}.auth-root .auth-btn.accent{background:var(--accent);color:#fff}.auth-root .auth-btn.accent:hover:not(:disabled){background:var(--accent-deep)}.auth-root .auth-btn.method{color:var(--ink);background:#fff;justify-content:center;font-size:15px;font-weight:600;box-shadow:0 2px 6px #0c2c3d0f}.auth-root .auth-btn.method:hover{background:#f5f8fc;box-shadow:0 4px 12px #0c2c3d14}.auth-root .otp-boxes{justify-content:center;gap:8px;margin:8px 0;display:flex}.auth-root .otp-boxes input{text-align:center;width:42px;height:50px;font:700 20px/1 var(--sans-auth);color:var(--ink);background:#fff;border:0;border-radius:10px;outline:0;transition:box-shadow .15s,background .15s;box-shadow:0 2px 6px #0c2c3d0a}.auth-root .otp-boxes input:focus{box-shadow:0 0 0 2px var(--accent),0 4px 10px #29b7d21f;background:#fff}.auth-root .otp-resend{text-align:center;color:var(--ink-3);margin-top:4px;font-size:13px}.auth-root .otp-resend strong{color:var(--accent-deep);cursor:pointer}.auth-root .auth-below{text-align:center;color:var(--ink-2);margin-top:18px;font-size:14px}.auth-root .auth-below strong{color:var(--ink);cursor:pointer;font-weight:700}.auth-root .auth-below strong:hover{color:var(--accent-deep)}.auth-root .auth-error{color:#b13a1b;text-align:center;background:#fde2e2;border:1px solid #f4b8b8;border-radius:10px;margin-bottom:4px;padding:8px 12px;font-size:12.5px;font-weight:500}@media (max-width:480px){.auth-root .auth-card{padding:28px 22px 26px}}
