:root{--bg-0:#080a0f;--bg-1:#0f131b;--surface-1:#151a24;--surface-2:#1c222e;--surface-3:#252c3a;--border:#2c3444;--border-2:#67718a;--text:#eef2f8;--muted:#a3aec2;--faint:#828fa4;--accent:#ff8a5c;--accent-fill:#ff7a45;--accent-lo:#ffa173;--on-accent:#20120a;--ok:#5fe0a5;--ok-fill:#3ecf8e;--on-ok:#062318;--bad:#ff7a7a;--pink:#ff9db0;--r-card:28px;--r-field:14px;--shadow:0 0 0 1px var(--border), 0 1px 0 #ffffff0d inset, 0 40px 90px -40px #000000e6, 0 0 130px -46px #ff7a454d;--spring:cubic-bezier(.34,1.56,.64,1)}*{box-sizing:border-box}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}html,body{height:100%}body{color:var(--text);background:radial-gradient(90% 60% at 18% 0%, #ff7a451a 0%, transparent 58%), radial-gradient(80% 60% at 100% 100%, #5e84ff1a 0%, transparent 55%), linear-gradient(165deg, var(--bg-1), var(--bg-0));-webkit-font-smoothing:antialiased;place-items:center;margin:0;padding:32px 16px;font-family:Inter,-apple-system,system-ui,Segoe UI,sans-serif;display:grid}.room{place-items:center;width:100%;display:grid}.card{background:var(--surface-1);border-radius:var(--r-card);width:min(800px,100%);min-height:560px;box-shadow:var(--shadow);will-change:transform;grid-template-columns:360px 1fr;display:grid;overflow:hidden}.pet{grid-area:1/1}.form{grid-area:1/2}.pet{background:radial-gradient(78% 54% at 50% 62%, #ff8a5c21, transparent 70%), linear-gradient(158deg, var(--surface-2), #171c26);border-right:1px solid var(--border);place-items:center;padding:20px 10px 6px;display:grid;position:relative}.pet:before{content:"";pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'><g fill='%23ffffff'><ellipse cx='26' cy='32' rx='9.5' ry='8'/><circle cx='15' cy='20' r='4.2'/><circle cx='25' cy='16' r='4.4'/><circle cx='35' cy='18' r='4.2'/><circle cx='42' cy='26' r='3.5'/></g><g fill='%23ffffff' transform='translate(50,48) rotate(20)'><ellipse cx='17' cy='21' rx='7.6' ry='6.4'/><circle cx='8' cy='12' r='3.4'/><circle cx='16' cy='9' r='3.6'/><circle cx='24' cy='10' r='3.4'/><circle cx='30' cy='16' r='2.8'/></g></svg>");background-size:74px 74px;position:absolute;inset:0}.pet:after{content:"";pointer-events:none;background:linear-gradient(#0000,#ff8a5c1a);height:130px;position:absolute;bottom:0;left:0;right:0}.sheen{pointer-events:none;z-index:0;opacity:0;will-change:transform;background:radial-gradient(circle,#bad6ff29,#bad6ff00 68%);border-radius:50%;width:440px;height:440px;margin:-220px 0 0 -220px;transition:opacity .45s;position:absolute;top:0;left:0}.card:hover .sheen{opacity:1}.pet__pat{z-index:2;cursor:pointer;background:0 0;border:0;border-radius:20px;padding:0;position:absolute;inset:34px 8px 8px}.cat{z-index:1;pointer-events:none;width:100%;max-width:340px;height:auto;display:block;position:relative;overflow:visible}.cat__shadow{fill:#00000057}.cat__body,.cat__head{fill:url(#mFur)}.cat__tuft{fill:#d2dfee}.cat__belly{fill:url(#mCream)}.cat__muzzle{fill:#fff6ea}.cat__inner{fill:#ffa9bd}.cat__paw{fill:#fff2e2}.cat__bean{fill:#ffa9bd}.cat__nose{fill:#f2879b}.cat__tail{stroke:#a8c0d8;stroke-width:19px}.cat__stripe{fill:none;stroke:#7d9ab9;stroke-width:6px;stroke-linecap:round}.cat__eye{fill:#20293a}.cat__spark{fill:#fff}.cat__spark--sm{fill:#fff;opacity:.75}.cat__eyeline{fill:none;stroke:#20293a;stroke-width:6px;stroke-linecap:round;opacity:0}.cat__mouth{fill:none;stroke:#20293a;stroke-width:4px;stroke-linecap:round;stroke-linejoin:round}.cat__tongue{fill:#ff7e92;opacity:0}.cat__blush{fill:var(--pink);opacity:0}.cat__whiskers path{fill:none;stroke:#bfd2e4;stroke-width:3px;stroke-linecap:round}.cat__joy *{pointer-events:none}.cat__collar{fill:none;stroke:var(--accent-fill);stroke-width:13px;stroke-linecap:round}.cat__collar-loop{fill:none;stroke:#d9542a;stroke-width:4px;stroke-linecap:round}.cat__bell{fill:url(#mBell)}.cat__bell-line{fill:none;stroke:#b87a1e;stroke-width:2.2px;stroke-linecap:round}.cat__bell-slit{fill:none;stroke:#b87a1e;stroke-width:3px;stroke-linecap:round}.cat__bell-hi{fill:#fff3cc;opacity:.85}.bubble{z-index:3;--bubble-bg:#f4f7fc;text-align:center;color:#141a24;opacity:0;transform-origin:50% 130%;width:fit-content;max-width:calc(100% - 40px);transition:opacity .16s ease, transform .42s var(--spring);pointer-events:none;filter:drop-shadow(0 16px 22px #000000a6);background:0 0;margin:0 auto;padding:11px 20px 12px;font-family:Fredoka,system-ui,sans-serif;font-size:15.5px;font-weight:600;line-height:1.15;position:absolute;top:48px;left:0;right:0;transform:translateY(10px)scale(.7)}.bubble__cloud{background:var(--bubble-bg);border-radius:22px;position:absolute;inset:0}.bubble__cloud i{width:var(--d);height:var(--d);background:var(--bubble-bg);left:var(--x,auto);right:var(--r,auto);top:var(--y,auto);bottom:var(--b,auto);border-radius:50%;display:block;position:absolute}.bubble__text{z-index:1;position:relative}.bubble__tail{width:30px;height:var(--tail-h,62px);margin-left:-15px;display:block;position:absolute;top:calc(100% - 2px);left:50%;overflow:visible}.bubble__tail path{fill:var(--bubble-bg)}.bubble.is-on{opacity:1;transform:translate(0,0)scale(1)}.bubble.is-bad{--bubble-bg:#ff6b6b;color:#2b0808}.bubble.is-good{--bubble-bg:var(--ok);color:var(--on-ok)}.form{flex-direction:column;justify-content:center;padding:30px 32px 26px 38px;display:flex;position:relative}.rail{background:var(--accent);pointer-events:none;opacity:0;width:4px;height:46px;transition:transform .44s var(--spring), opacity .22s ease;border-radius:3px;position:absolute;top:0;left:16px;transform:translate(0,0);box-shadow:0 0 18px #ff8a5cbf}.brand{align-items:center;gap:10px;margin-bottom:22px;display:flex}.brand__mark{width:34px;height:34px;color:var(--on-accent);background:linear-gradient(150deg, var(--accent-lo), var(--accent-fill));border-radius:11px;place-items:center;display:grid;box-shadow:0 8px 20px -8px #ff7a45e6,inset 0 1px #ffffff59}.brand__mark svg{width:20px;height:20px;transform:rotate(-8deg)}.brand__name{letter-spacing:-.2px;font-family:Fredoka,system-ui,sans-serif;font-size:19px;font-weight:600}.brand__tag{letter-spacing:.9px;text-transform:uppercase;color:var(--accent);background:#ff8a5c21;border:1px solid #ff8a5c42;border-radius:6px;padding:3px 7px;font-size:10px;font-weight:700}.form__title{letter-spacing:-.4px;margin:0 0 4px;font-family:Fredoka,system-ui,sans-serif;font-size:29px;font-weight:600;line-height:1.1}.form__sub{color:var(--muted);margin:0 0 22px;font-size:13.5px}.field{margin-bottom:14px}.field label{letter-spacing:.7px;text-transform:uppercase;color:var(--muted);margin:0 0 6px 2px;font-size:11.5px;font-weight:600;transition:color .18s;display:block}.field__wrap{position:relative}input{width:100%;height:46px;color:var(--text);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-field);outline:none;padding:0 15px;font-family:inherit;font-size:15px;font-weight:500;transition:border-color .2s,background .2s,box-shadow .2s}#pw{letter-spacing:.4px;padding-right:46px}input::placeholder{color:var(--faint);font-weight:400}input:hover{border-color:#3a4356}input:focus{border-color:var(--accent-fill);background:#202734;box-shadow:0 0 0 4px #ff7a4529}.card.is-bad input{border-color:#e5484d8c}.field:focus-within label{color:var(--accent)}.caps{height:17px;color:var(--bad);opacity:1;margin:6px 0 0 2px;font-size:12px;font-weight:600;line-height:17px;transition:opacity .2s}.caps:empty{opacity:0}.peek{cursor:pointer;width:36px;height:36px;color:var(--faint);background:0 0;border:0;border-radius:10px;place-items:center;padding:0;transition:color .18s,background .18s;display:grid;position:absolute;top:50%;right:6px;transform:translateY(-50%)}.peek:hover{color:var(--accent);background:#ff8a5c1f}.peek svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}#peekSlash{stroke-dasharray:22;stroke-dashoffset:0;transition:stroke-dashoffset .26s}.peek[aria-pressed=true]{color:var(--accent)}.peek[aria-pressed=true] #peekSlash{stroke-dashoffset:22px}.row{justify-content:space-between;align-items:center;gap:12px;margin:2px 0 18px;display:flex}.check{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:9px;display:inline-flex}.check input{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.check__box{border:2px solid var(--border-2);background:var(--surface-2);border-radius:7px;flex:none;place-items:center;width:20px;height:20px;transition:background .18s,border-color .18s;display:grid}.check__box svg{fill:none;width:13px;height:13px;stroke:var(--on-accent);stroke-width:3.4px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24px;transition:stroke-dashoffset .3s}.check input:checked+.check__box{background:var(--accent-fill);border-color:var(--accent-fill)}.check input:checked+.check__box svg{stroke-dashoffset:0}.check input:focus-visible+.check__box{outline:3px solid var(--accent);outline-offset:3px}.check__text{color:var(--muted);font-size:12.5px;font-weight:500}.link{color:var(--accent);border-radius:5px;font-size:12.5px;font-weight:600;text-decoration:none}.link:hover{text-underline-offset:3px;text-decoration:underline}.submit{letter-spacing:.2px;width:100%;height:50px;color:var(--on-accent);background:linear-gradient(180deg, var(--accent-lo), var(--accent-fill));border-radius:var(--r-field);cursor:pointer;transition:transform .18s var(--spring), box-shadow .2s ease, background .34s ease;border:0;place-items:center;margin-top:6px;font-family:Fredoka,system-ui,sans-serif;font-size:16.5px;font-weight:600;display:grid;position:relative;box-shadow:0 14px 28px -12px #ff7a45e6,inset 0 1px #fff6}.submit:hover{transform:translateY(-1px)}.submit:active{transform:translateY(1px)scale(.99)}.submit__label,.submit__tick{grid-area:1/1}.submit__tick{fill:none;width:26px;height:26px;stroke:var(--on-ok);stroke-width:3.2px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:30;stroke-dashoffset:30px;opacity:0}.card.is-good .submit{background:linear-gradient(180deg, var(--ok), var(--ok-fill));color:var(--on-ok);box-shadow:0 14px 28px -12px #3ecf8ed9,inset 0 1px #fff6}.card.is-good .submit__label{opacity:0;transition:opacity .16s,transform .16s;transform:scale(.9)}.card.is-good .submit__tick{opacity:1;stroke-dashoffset:0;transition:stroke-dashoffset .42s 60ms,opacity .1s}.status{text-align:center;min-height:19px;color:var(--muted);opacity:0;transition:opacity .2s ease, transform .3s var(--spring);margin:12px 0 0;font-size:13px;font-weight:600;transform:translateY(-4px)}.status.is-on{opacity:1;transform:none}.status.is-bad{color:var(--bad)}.status.is-good{color:var(--ok)}.divider{letter-spacing:.4px;color:var(--faint);align-items:center;gap:12px;margin:18px 0 14px;font-size:11.5px;font-weight:500;display:flex}.divider:before,.divider:after{content:"";background:var(--border);flex:1;height:1px}.oauth{grid-template-columns:1fr 1fr;gap:10px;display:grid}.oauth__btn{height:44px;color:var(--text);background:var(--surface-3);border:1px solid var(--border);cursor:pointer;transition:border-color .18s ease, background .18s ease, transform .18s var(--spring);border-radius:12px;justify-content:center;align-items:center;gap:8px;font-family:inherit;font-size:13.5px;font-weight:600;display:inline-flex}.oauth__btn:hover{border-color:var(--border-2);background:#2b3242;transform:translateY(-1px)}.oauth__btn:active{transform:translateY(1px)}.foot{text-align:center;color:var(--muted);margin:16px 0 0;font-size:12.5px}.demo{border-top:1px dashed var(--border);text-align:center;color:var(--faint);margin:12px 0 0;padding-top:11px;font-size:11px}.demo b{color:var(--accent);font-weight:600}:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:6px}::selection{color:#fff;background:#ff8a5c52}@media (width<=839px){.pet{grid-area:1/1}.form{grid-area:2/1}.card{grid-template-columns:1fr;min-height:0}.pet{border-right:0;border-bottom:1px solid var(--border);padding:56px 10px 0}.cat{max-width:230px}.form{padding:22px 22px 20px 30px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}