.trio-auth{--bg-app:#fff;--bg-side:#fff;--bg-hover:#f2f4f7;--bg-input:#f0f2f5;--bg-chip:#e9ebef;--border:#e7e9ee;--text:#0f1620;--text-2:#5f6b7a;--text-3:#98a1ad;--accent:#3a7dff;--accent-soft:#e5efff;--green:#2eb956;--red:#f34e6c;--grad-out:linear-gradient(135deg, #3f8dff 0%, #7a5cff 55%, #b44cff 100%);--grad-logo:linear-gradient(135deg, #4e8cff, #7a5cff 55%, #b44cff);--shadow-1:0 1px 2px #0f162014;--shadow-2:0 10px 30px -8px #0f16202e;--blob1:#4e8cff29;--blob2:#b44cff21;min-height:100dvh;color:var(--text);background:var(--bg-app);grid-template-columns:1.02fr 1fr;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif;font-size:16px;line-height:1.55;display:grid;overflow-x:hidden}html.dark .trio-auth{--bg-app:#141924;--bg-side:#161c28;--bg-hover:#1e2634;--bg-input:#202836;--bg-chip:#232c3b;--border:#242c3a;--text:#e9edf3;--text-2:#96a0ae;--text-3:#6b7683;--accent:#5b9bff;--accent-soft:#1d2c46;--green:#3ddc68;--grad-out:linear-gradient(135deg, #3b7df0 0%, #6f54f2 55%, #a04ae6 100%);--shadow-1:0 1px 2px #00000059;--shadow-2:0 10px 32px -8px #0000008c;--blob1:#3b7df033;--blob2:#a04ae629}.trio-auth :where(button){font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;padding:0}.trio-auth :where(input){font:inherit;color:inherit}.trio-auth :where(a){color:inherit;text-decoration:none}.trio-auth :where(h1,p){margin:0}.trio-auth :focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:8px}.trio-auth .ic{flex:none;width:20px;height:20px;display:inline-flex}.trio-auth .ic svg{width:100%;height:100%}.trio-auth .logo-mark{background:var(--grad-logo);border-radius:13px;flex:none;place-items:center;width:40px;height:40px;display:grid;box-shadow:0 4px 14px #6e50ff59}.trio-auth .logo-mark svg{width:23px;height:23px}.trio-auth .logo-row{letter-spacing:-.2px;align-items:center;gap:10px;font-size:19px;font-weight:800;display:flex}.trio-auth .brand{color:#fff;background:linear-gradient(135deg,#3f8dff,#7a5cff 55%,#b44cff);flex-direction:column;padding:44px 52px;display:flex;position:relative;overflow:hidden}.trio-auth .brand:before{content:"";pointer-events:none;background:radial-gradient(46% 38% at 28% 30%,#ffffff29,#0000 70%),radial-gradient(42% 40% at 76% 68%,#140a5038,#0000 70%);animation:16s ease-in-out infinite alternate trio-aurora;position:absolute;inset:-40%}@keyframes trio-aurora{0%{transform:translate(-3%,-2%)rotate(0)}to{transform:translate(3%,2%)rotate(4deg)}}.trio-auth .brand:after{content:"";pointer-events:none;background-image:var(--doodle-white,none);opacity:.5;background-size:320px 320px;position:absolute;inset:0}.trio-auth .brand>*{z-index:2;position:relative}.trio-auth .brand-top{justify-content:space-between;align-items:center;gap:12px;display:flex}.trio-auth .brand-top .logo-mark{box-shadow:none;background:#fff3}.trio-auth .pill-live{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);white-space:nowrap;background:#ffffff24;border:1px solid #ffffff40;border-radius:16px;align-items:center;gap:8px;padding:8px 14px;font-size:12.5px;font-weight:700;display:inline-flex}.trio-auth .pill-live i{background:#7dffa8;border-radius:50%;width:8px;height:8px;animation:1.6s infinite trio-pulse}@keyframes trio-pulse{0%{box-shadow:0 0 #7dffa88c}70%{box-shadow:0 0 0 8px #7dffa800}to{box-shadow:0 0 #7dffa800}}.trio-auth .brand-mid{flex-direction:column;flex:1;justify-content:center;gap:30px;padding:34px 0;display:flex}.trio-auth .quote-box{min-height:132px;position:relative}.trio-auth .quote{letter-spacing:-.4px;opacity:0;max-width:430px;font-size:clamp(23px,2.3vw,31px);font-weight:800;line-height:1.32;transition:opacity .5s,transform .5s;position:absolute;inset:0;transform:translateY(10px)}.trio-auth .quote.on{opacity:1;transform:translateY(0)}.trio-auth .mini{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1f;border:1px solid #ffffff40;border-radius:20px;flex-direction:column;align-self:flex-start;gap:8px;min-width:320px;max-width:360px;min-height:168px;padding:16px;display:flex}.trio-auth .amb{opacity:0;border-radius:15px;max-width:88%;padding:9px 13px;font-size:13.5px;line-height:1.45;transition:opacity .4s,transform .4s;transform:translateY(10px)}.trio-auth .amb.show{opacity:1;transform:translateY(0)}.trio-auth .amb.in{color:#1a2130;background:#fffffff0;border-bottom-left-radius:5px;align-self:flex-start}.trio-auth .amb.out{background:#10142880;border-bottom-right-radius:5px;align-self:flex-end}.trio-auth .amb.typing{background:#ffffff2e;border-radius:15px;align-self:flex-start;align-items:center;gap:4px;padding:12px 14px;display:flex}.trio-auth .amb.typing i{background:#ffffffd9;border-radius:50%;width:6px;height:6px;animation:1.2s ease-in-out infinite trio-tb}.trio-auth .amb.typing i:nth-child(2){animation-delay:.15s}.trio-auth .amb.typing i:nth-child(3){animation-delay:.3s}@keyframes trio-tb{0%,60%,to{opacity:.5;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}.trio-auth .brand-bottom{flex-wrap:wrap;gap:10px;display:flex}.trio-auth .tchip{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffff1a;border:1px solid #ffffff4d;border-radius:13px;align-items:center;gap:7px;padding:8px 13px;font-size:12.5px;font-weight:700;display:inline-flex}.trio-auth .pane{background:var(--bg-app);overscroll-behavior:contain;flex-direction:column;min-width:0;max-height:100dvh;display:flex;position:relative;overflow:hidden auto}.trio-auth .blob{filter:blur(90px);pointer-events:none;z-index:0;border-radius:50%;position:absolute}.trio-auth .b1{background:var(--blob1);width:420px;height:420px;animation:18s ease-in-out infinite alternate trio-drift;top:-140px;right:-120px}.trio-auth .b2{background:var(--blob2);width:380px;height:380px;animation:22s ease-in-out infinite alternate-reverse trio-drift;bottom:-140px;left:-110px}@keyframes trio-drift{0%{transform:translate(0)}to{transform:translate(30px,26px)}}.trio-auth .pane-top{z-index:2;justify-content:space-between;align-items:center;padding:20px 26px;display:flex;position:relative}.trio-auth .back-link{color:var(--text-2);border-radius:10px;align-items:center;gap:7px;padding:6px 10px;font-size:14.5px;font-weight:700;display:inline-flex}.trio-auth .back-link:hover{background:var(--bg-hover);color:var(--text)}.trio-auth .theme-btn{width:42px;height:42px;color:var(--text-2);border-radius:50%;place-items:center;display:grid}.trio-auth .theme-btn:hover{background:var(--bg-hover);color:var(--text)}.trio-auth .pane-center{z-index:2;flex:1 0 auto;place-items:start center;padding:8px 24px 56px;display:grid;position:relative}.trio-auth .card{width:min(440px,100%)}.trio-auth .card-head{flex-direction:column;align-items:center;gap:14px;margin-bottom:22px;display:flex}.trio-auth .card-head .logo-mark{border-radius:17px;width:54px;height:54px}.trio-auth .card-head .logo-mark svg{width:31px;height:31px}.trio-auth .seg{background:var(--bg-input);border-radius:15px;margin-bottom:24px;padding:4px;display:flex;position:relative}.trio-auth .seg-thumb{background:var(--bg-side);width:calc(50% - 4px);height:calc(100% - 8px);box-shadow:var(--shadow-1);border-radius:12px;transition:transform .28s cubic-bezier(.3,1.2,.4,1);position:absolute;top:4px;left:4px}.trio-auth .seg.signup .seg-thumb{transform:translate(100%)}.trio-auth .seg button{height:42px;color:var(--text-2);z-index:2;border-radius:12px;flex:1;font-size:14.5px;font-weight:800;transition:color .2s;position:relative}.trio-auth .seg button.on{color:var(--text)}.trio-auth .prog{gap:8px;margin-bottom:24px;display:flex}.trio-auth .prog span{letter-spacing:.6px;text-transform:uppercase;color:var(--text-3);flex-direction:column;flex:1;gap:6px;font-size:11px;font-weight:800;display:flex}.trio-auth .prog i{background:var(--bg-chip);border-radius:2px;height:4px;transition:background .3s}.trio-auth .prog span.done i{background:var(--accent)}.trio-auth .prog span.act{color:var(--accent)}.trio-auth .prog span.act i{background:var(--grad-out)}.trio-auth h1.h{letter-spacing:-.6px;margin-bottom:8px;font-size:26px;font-weight:900;line-height:1.28}.trio-auth p.sub{color:var(--text-2);margin-bottom:24px;font-size:15px}.trio-auth p.sub b{color:var(--text)}.trio-auth .field{margin-bottom:16px}.trio-auth .field label{margin-bottom:7px;font-size:13.5px;font-weight:800;display:block}.trio-auth .hint{color:var(--text-3);margin-top:6px;font-size:12.5px}.trio-auth .hint.err{color:var(--red);font-weight:700}.trio-auth .hint.ok{color:var(--green);font-weight:700}.trio-auth .inwrap{position:relative}.trio-auth .lead-ic{color:var(--text-3);pointer-events:none;width:19px;height:19px;position:absolute;top:50%;left:15px;transform:translateY(-50%)}.trio-auth .tin{border:1.5px solid var(--border);background:var(--bg-side);border-radius:15px;outline:none;width:100%;height:52px;padding:0 16px 0 44px;font-size:15.5px;transition:border-color .15s,box-shadow .15s}.trio-auth .tin.no-ic{padding-left:36px}.trio-auth .tin::placeholder{color:var(--text-3)}.trio-auth .tin:focus{border-color:var(--accent);box-shadow:0 0 0 3.5px var(--accent-soft)}.trio-auth .tin.invalid{border-color:var(--red);box-shadow:0 0 0 3.5px #f34e6c21}.trio-auth .in-prefix:before{content:"@";color:var(--text-3);z-index:2;font-weight:800;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.trio-auth .btn{white-space:nowrap;border-radius:15px;justify-content:center;align-items:center;gap:9px;width:100%;height:52px;padding:0 26px;font-size:15.5px;font-weight:800;transition:transform .15s,box-shadow .2s,filter .2s;display:inline-flex}.trio-auth .btn:active{transform:scale(.98)}.trio-auth .btn-primary{background:var(--grad-out);color:#fff;box-shadow:0 10px 26px -8px #7a5cff8c}.trio-auth .btn-primary:hover{filter:brightness(1.07)}.trio-auth .btn-primary[disabled]{opacity:.55;box-shadow:none;cursor:not-allowed}.trio-auth .btn-ghost{border:1.5px solid var(--border);color:var(--text);background:var(--bg-side)}.trio-auth .btn-ghost:hover{background:var(--bg-hover)}.trio-auth .spinner{border:2.5px solid #fff6;border-top-color:#fff;border-radius:50%;flex:none;width:18px;height:18px;animation:.7s linear infinite trio-spin}@keyframes trio-spin{to{transform:rotate(360deg)}}.trio-auth .sso-row{flex-direction:column;gap:10px;margin-bottom:6px;display:flex}.trio-auth .divider{color:var(--text-3);letter-spacing:1.6px;align-items:center;gap:12px;margin:18px 0;font-size:11.5px;font-weight:800;display:flex}.trio-auth .divider:before,.trio-auth .divider:after{content:"";background:var(--border);flex:1;height:1px}.trio-auth .enc-note{color:var(--text-3);text-align:center;justify-content:center;align-items:center;gap:7px;margin-top:18px;font-size:13px;font-weight:600;display:flex}.trio-auth .swap-line{text-align:center;color:var(--text-2);margin-top:20px;font-size:14px}.trio-auth .swap-line button{color:var(--accent);font-weight:800}.trio-auth .swap-line button:hover{text-decoration:underline}.trio-auth .resend{text-align:center;color:var(--text-2);margin-top:14px;font-size:13.5px}.trio-auth .resend button{color:var(--accent);font-weight:800}.trio-auth .resend button[disabled]{color:var(--text-3);cursor:default}.trio-auth .otp-status{gap:8px;margin-top:14px;display:grid}.trio-auth .otp-status-line{color:var(--text-2);text-align:center;justify-content:center;align-items:center;gap:8px;font-size:12.5px;display:flex}.trio-auth .otp-status-line.muted{color:var(--text-3)}.trio-auth .otp-dot{background:var(--ok,#48c15c);border-radius:50%;flex:none;width:7px;height:7px}.trio-auth .otp-dot.busy{background:var(--accent);animation:1.1s ease-in-out infinite trioOtpPulse}@keyframes trioOtpPulse{0%,to{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}.trio-auth .otp-bar{background:var(--bg-input,#7f7f7f2e);border-radius:999px;height:4px;overflow:hidden}.trio-auth .otp-bar>i{background:linear-gradient(135deg,#3f8dff,#7a5cff);border-radius:999px;height:100%;transition:width .9s linear;display:block}@media (prefers-reduced-motion:reduce){.trio-auth .otp-dot.busy{animation:none}.trio-auth .otp-bar>i{transition:none}}.trio-auth .otp-row{justify-content:space-between;gap:10px;margin:4px 0;display:flex}.trio-auth .otp-i{border:1.5px solid var(--border);background:var(--bg-side);text-align:center;border-radius:15px;outline:none;width:56px;min-width:0;height:62px;font-size:25px;font-weight:900;transition:border-color .15s,box-shadow .15s,transform .1s}.trio-auth .otp-i:focus{border-color:var(--accent);box-shadow:0 0 0 3.5px var(--accent-soft);transform:scale(1.05)}.trio-auth .otp-i.filled{border-color:var(--accent);background:var(--accent-soft)}.trio-auth .swatches{flex-wrap:wrap;gap:10px;margin-top:4px;display:flex}.trio-auth .sw{color:#fff;border:3px solid #0000;border-radius:50%;place-items:center;width:44px;height:44px;transition:transform .15s,border-color .15s;display:grid}.trio-auth .sw:hover{transform:scale(1.1)}.trio-auth .sw.sel{border-color:var(--text)}.trio-auth .sw svg{opacity:0;width:18px;height:18px;transition:opacity .15s}.trio-auth .sw.sel svg{opacity:1}.trio-auth .kg{border:1.5px solid var(--border);background:var(--bg-side);border-radius:18px;margin-bottom:18px;padding:20px}.trio-auth .kg-row{color:var(--text-3);align-items:center;gap:12px;padding:9px 2px;font-size:14.5px;font-weight:700;transition:color .3s;display:flex}.trio-auth .kg-ic{background:var(--bg-input);width:26px;height:26px;color:var(--text-3);border-radius:50%;flex:none;place-items:center;display:grid}.trio-auth .kg-ic svg{width:15px;height:15px}.trio-auth .kg-row.run{color:var(--text)}.trio-auth .kg-row.run .kg-ic{background:var(--accent-soft);color:var(--accent)}.trio-auth .kg-row.run .kg-ic .sp{border:2.5px solid var(--accent-soft);border-top-color:var(--accent);border-radius:50%;width:14px;height:14px;animation:.7s linear infinite trio-spin}.trio-auth .kg-row.ok{color:var(--text)}.trio-auth .kg-row.ok .kg-ic{color:var(--green);background:#2eb95624}.trio-auth .kg-note{color:var(--text-3);text-align:center;font-size:12.5px}.trio-auth .done-tile{text-align:center;padding:6px 0;position:relative}.trio-auth .done-ck{background:var(--grad-out);color:#fff;border-radius:50%;place-items:center;width:92px;height:92px;margin:0 auto 22px;animation:.45s cubic-bezier(.3,1.5,.5,1) trio-rxpop;display:grid;box-shadow:0 16px 38px -10px #7a5cff99}.trio-auth .done-ck svg{width:46px;height:46px}@keyframes trio-rxpop{0%{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}.trio-auth .confetti{pointer-events:none;position:absolute;inset:0}.trio-auth .confetti i{opacity:0;border-radius:2px;width:8px;height:8px;margin-left:-4px;position:absolute;top:44px;left:50%}.trio-auth .step{animation:.3s trio-stepin}@keyframes trio-stepin{0%{opacity:0;transform:translate(16px)}to{opacity:1;transform:translate(0)}}.trio-auth .pane-foot{z-index:2;color:var(--text-3);flex-wrap:wrap;justify-content:center;align-items:center;gap:18px;padding:0 20px 22px;font-size:12.5px;display:flex;position:relative}.trio-auth .pane-foot a:hover{color:var(--text);text-decoration:underline}.trio-auth .toast{z-index:99;background:var(--text);color:var(--bg-app);box-shadow:var(--shadow-2);opacity:0;pointer-events:none;border-radius:14px;max-width:86vw;padding:10px 18px;font-size:13.5px;font-weight:700;transition:opacity .25s,transform .25s;position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px)}.trio-auth .toast.show{opacity:1;transform:translate(-50%)}@media (width<=1023px){.trio-auth{grid-template-columns:1fr}.trio-auth .brand{display:none}}@media (width<=520px){.trio-auth .otp-i{width:46px;height:56px;font-size:22px}.trio-auth .otp-row{gap:7px}.trio-auth .pane-center{padding:8px 18px calc(48px + env(safe-area-inset-bottom))}}@media (prefers-reduced-motion:reduce){.trio-auth *,.trio-auth :before,.trio-auth :after{transition:none!important;animation:none!important}.trio-auth .quote.on,.trio-auth .amb{opacity:1;transform:none}}.trio-auth .method-row{gap:8px;margin-bottom:14px;display:flex}.trio-auth .method-tab{border:1.5px solid var(--border);background:var(--bg-side);height:40px;color:var(--text-2);cursor:pointer;border-radius:12px;flex:1;justify-content:center;align-items:center;gap:7px;font-size:13.5px;font-weight:800;transition:border-color .15s,color .15s,background .15s;display:inline-flex}.trio-auth .method-tab.on{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, transparent)}.trio-auth .pw-eye{width:32px;height:32px;color:var(--text-3);cursor:pointer;background:0 0;border:0;border-radius:9px;justify-content:center;align-items:center;display:inline-flex;position:absolute;top:50%;right:12px;transform:translateY(-50%)}.trio-auth .pw-eye:hover{color:var(--text)}.trio-logo-img{border-radius:inherit;object-fit:cover;width:100%;height:100%;display:block}:is(.rail-logo:has(.trio-logo-img),.logo-mark:has(.trio-logo-img),.avatar:has(.trio-logo-img)){background:0 0!important}