:root{--accent: #7c3aed;--accent2: #a78bfa;--bg: #06060f;--text: #ffffff;--text-dim: rgba(255, 255, 255, 0.5);--text-dimmer:rgba(255, 255, 255, 0.28);--glass-bg: rgba(255, 255, 255, 0.07);--glass-bdr: rgba(255, 255, 255, 0.1);--field-bg: rgba(255, 255, 255, 0.06);--field-bdr: rgba(255, 255, 255, 0.1);--field-focus:rgba(124, 58, 237, 0.5);--ctrl-bg: rgba(6, 6, 15, 0.8);--ctrl-bdr: rgba(255, 255, 255, 0.08);--tag-bg: rgba(255, 255, 255, 0.06);--tag-bdr: rgba(255, 255, 255, 0.1);--kbd-bg: rgba(255, 255, 255, 0.07);--error: #f43f5e}body.light{--bg: #e8e8f2;--text: #0a0a14;--text-dim: rgba(0, 0, 0, 0.5);--text-dimmer:rgba(0, 0, 0, 0.28);--glass-bg: rgba(255, 255, 255, 0.55);--glass-bdr: rgba(0, 0, 0, 0.1);--field-bg: rgba(0, 0, 0, 0.04);--field-bdr: rgba(0, 0, 0, 0.12);--field-focus:rgba(124, 58, 237, 0.4);--ctrl-bg: rgba(232, 232, 242, 0.85);--ctrl-bdr: rgba(0, 0, 0, 0.08);--tag-bg: rgba(0, 0, 0, 0.05);--tag-bdr: rgba(0, 0, 0, 0.1);--kbd-bg: rgba(0, 0, 0, 0.07)}body.bg-particles{--accent: #06b6d4;--accent2: #67e8f9}body.bg-waves{--accent: #f43f5e;--accent2: #fda4af}body.bg-stars{--accent: #facc15;--accent2: #fde68a}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,sans-serif;transition:background .5s,color .4s;overflow:hidden}.bg-layer{position:fixed;inset:0;pointer-events:none;opacity:0;transition:opacity .6s ease}.bg-layer.active{opacity:1}.geo-shape{position:absolute;border:1px solid rgba(124,58,237,.2);transform-style:preserve-3d;animation:geo-spin var(--dur, 20s) linear infinite;animation-delay:var(--delay, 0s)}.geo-shape:nth-child(3n){border-radius:50%}.geo-shape:nth-child(4n){clip-path:polygon(50% 0%, 100% 100%, 0% 100%);background:rgba(124,58,237,.04);border:none}.geo-shape:nth-child(5n){clip-path:polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);background:rgba(167,139,250,.04);border:none}@keyframes geo-spin{from{transform:rotateX(var(--rx, 30deg)) rotateY(0deg) rotateZ(var(--rz, 15deg))}to{transform:rotateX(var(--rx, 30deg)) rotateY(360deg) rotateZ(var(--rz, 15deg))}}.stars-el{position:absolute;width:1px;height:1px;border-radius:50%;animation:star-twinkle 5s ease-in-out infinite alternate}@keyframes star-twinkle{0%{opacity:.3}100%{opacity:1}}#bgWaves::before,#bgWaves::after{content:"";position:absolute;border-radius:45%}#bgWaves::before{width:200%;height:200%;top:-50%;left:-50%;background:conic-gradient(from 0deg, rgba(244, 63, 94, 0.12), rgba(124, 58, 237, 0.08), rgba(6, 182, 212, 0.1), rgba(244, 63, 94, 0.12));animation:wave-spin 30s linear infinite}#bgWaves::after{width:180%;height:180%;top:-40%;left:-40%;background:conic-gradient(from 180deg, rgba(6, 182, 212, 0.08), rgba(244, 63, 94, 0.1), rgba(124, 58, 237, 0.12), rgba(6, 182, 212, 0.08));animation:wave-spin 18s linear infinite reverse;filter:blur(25px)}@keyframes wave-spin{to{transform:rotate(360deg)}}.topbar{position:fixed;top:0;left:0;right:0;z-index:50;height:3rem;display:flex;align-items:center;gap:1rem;padding:0 1.4rem;background:var(--ctrl-bg);backdrop-filter:blur(14px);border-bottom:1px solid var(--ctrl-bdr);transition:background .4s,border-color .4s}.tb__brand{display:flex;align-items:baseline;gap:.4rem}.tb__name{font-size:.7rem;color:var(--text-dim)}.tb__sep{font-size:.7rem;color:var(--text-dimmer)}.tb__title{font-size:.82rem;font-weight:600}.tb__right{display:flex;align-items:center;gap:.5rem;margin-left:auto}.tb__tag{padding:.18rem .5rem;border-radius:99px;border:1px solid var(--tag-bdr);background:var(--tag-bg);font-size:.68rem;color:var(--text-dim);transition:all .3s}.tb__toggle{width:2rem;height:2rem;border:1px solid var(--tag-bdr);border-radius:7px;background:var(--tag-bg);color:var(--text-dim);cursor:pointer;display:grid;place-items:center;transition:all .2s}.tb__toggle:hover{color:var(--text);border-color:var(--accent)}body.dark .icon-sun{display:none}body.dark .icon-moon{display:block}body.light .icon-moon{display:none}body.light .icon-sun{display:block}.main{height:100vh;display:flex;align-items:center;justify-content:center;padding:3.5rem 1rem 4rem}.card{width:100%;max-width:420px;background:var(--glass-bg);backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);border:1px solid var(--glass-bdr);border-radius:1.4rem;padding:clamp(1.6rem,4vw,2.2rem);box-shadow:0 20px 60px rgba(0,0,0,.22),0 0 0 1px var(--glass-bdr) inset;transition:background .4s,border-color .4s,transform .35s cubic-bezier(0.34, 1.56, 0.64, 1);position:relative;overflow:hidden}.card.shake{animation:shake .45s cubic-bezier(0.36, 0.07, 0.19, 0.97)}@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-9px)}40%{transform:translateX(9px)}60%{transform:translateX(-6px)}80%{transform:translateX(6px)}}.card__header{text-align:center;margin-bottom:1.8rem}.card__logo{display:inline-flex;width:3.2rem;height:3.2rem;align-items:center;justify-content:center;border-radius:12px;background:var(--field-bg);border:1px solid var(--glass-bdr);color:var(--accent2);margin-bottom:1rem;transition:color .4s,border-color .4s}.card__title{font-size:1.45rem;font-weight:700;margin-bottom:.3rem}.card__subtitle{font-size:.82rem;color:var(--text-dim)}.card__form{transition:opacity .35s,transform .35s}.card__form.hiding{opacity:0;transform:scale(0.96)}.card__success{display:none;flex-direction:column;align-items:center;text-align:center;gap:.7rem;padding:1rem 0}.card__success.visible{display:flex}.success__icon{width:5rem;height:5rem;margin-bottom:.5rem}.success__svg{width:100%;height:100%}.success__ring{fill:none;stroke:var(--accent);stroke-width:2;stroke-dasharray:160;stroke-dashoffset:160;animation:draw-ring .6s ease-out .1s forwards;transition:stroke .4s}.success__check{fill:none;stroke:var(--accent2);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:50;stroke-dashoffset:50;animation:draw-check .5s ease-out .55s forwards;transition:stroke .4s}@keyframes draw-ring{to{stroke-dashoffset:0}}@keyframes draw-check{to{stroke-dashoffset:0}}.success__title{font-size:1.5rem;font-weight:700;animation:fade-up .4s ease-out .9s both}.success__sub{font-size:.85rem;color:var(--text-dim);animation:fade-up .4s ease-out 1s both}.success__reset{margin-top:.8rem;padding:.45rem 1.1rem;border:1px solid var(--glass-bdr);border-radius:8px;background:var(--field-bg);color:var(--text-dim);font-size:.8rem;cursor:pointer;transition:all .2s;animation:fade-up .4s ease-out 1.1s both}.success__reset:hover{color:var(--text);border-color:var(--accent)}@keyframes fade-up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.field{margin-bottom:1.1rem}.field.error .field__input{border-color:var(--error);box-shadow:0 0 0 2px rgba(244,63,94,.2)}.field__label{display:block;font-size:.78rem;font-weight:500;color:var(--text-dim);margin-bottom:.4rem;letter-spacing:.03em;transition:color .4s}.field__wrap{position:relative;display:flex;align-items:center}.field__icon{position:absolute;left:.85rem;color:var(--text-dimmer);pointer-events:none;flex-shrink:0;transition:color .2s}.field__input{width:100%;padding:.7rem .9rem .7rem 2.4rem;background:var(--field-bg);border:1px solid var(--field-bdr);border-radius:10px;color:var(--text);font-size:.88rem;outline:none;transition:border-color .2s,box-shadow .2s,background .4s}.field__input::placeholder{color:var(--text-dimmer)}.field__input:focus{border-color:var(--field-focus);box-shadow:0 0 0 3px rgba(124,58,237,.15)}.field__input:focus+.field__icon,.field__input:focus~.field__icon{color:var(--accent2)}.field__wrap--pw .field__input{padding-right:2.8rem}.field__eye{position:absolute;right:.8rem;background:none;border:none;color:var(--text-dimmer);cursor:pointer;padding:.2rem;display:grid;place-items:center;transition:color .2s}.field__eye:hover{color:var(--text-dim)}body:not(.pw-visible) .eye-hide{display:none}body.pw-visible .eye-show{display:none}.field__error{display:block;font-size:.72rem;color:var(--error);margin-top:.3rem;min-height:1rem;transition:color .3s}.strength{display:flex;align-items:center;gap:.6rem;margin-top:.45rem;opacity:0;transition:opacity .25s}.strength.visible{opacity:1}.strength__track{flex:1;height:3px;background:var(--field-bdr);border-radius:2px;overflow:hidden}.strength__fill{height:100%;width:0%;border-radius:2px;transition:width .35s ease,background .35s ease}.strength__label{font-size:.68rem;font-weight:600;min-width:5.5rem;text-align:right;letter-spacing:.04em;transition:color .35s}.field__row{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.4rem;margin-top:-0.2rem}.checkbox{display:flex;align-items:center;gap:.55rem;cursor:pointer}.checkbox input{display:none}.checkbox__box{width:1rem;height:1rem;border:1px solid var(--field-bdr);border-radius:4px;background:var(--field-bg);transition:all .2s;display:grid;place-items:center}.checkbox__box::after{content:"";width:.5rem;height:.5rem;background:var(--accent);border-radius:2px;opacity:0;transition:opacity .15s}.checkbox input:checked~.checkbox__box{border-color:var(--accent)}.checkbox input:checked~.checkbox__box::after{opacity:1}.checkbox__label{font-size:.78rem;color:var(--text-dim);user-select:none}.forgot{font-size:.78rem;color:var(--accent2);text-decoration:none;transition:color .2s}.forgot:hover{color:var(--text)}.submit-btn{width:100%;padding:.82rem 1.4rem;background:var(--accent);border:none;border-radius:10px;color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .22s;position:relative;overflow:hidden}.submit-btn:hover:not(:disabled){background:color-mix(in srgb, var(--accent) 80%, white 20%);transform:translateY(-1px);box-shadow:0 6px 20px rgba(124,58,237,.4)}.submit-btn:active:not(:disabled){transform:translateY(0)}.submit-btn:disabled{opacity:.7;cursor:not-allowed}.submit-btn__arrow{flex-shrink:0;transition:transform .2s}.submit-btn:hover .submit-btn__arrow{transform:translateX(3px)}.submit-btn__spinner{display:none;width:1rem;height:1rem;border:2px solid hsla(0,0%,100%,.3);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}body.loading .submit-btn__text,body.loading .submit-btn__arrow{display:none}body.loading .submit-btn__spinner{display:block}@keyframes spin{to{transform:rotate(360deg)}}.card__foot{text-align:center;font-size:.78rem;color:var(--text-dim);margin-top:1.2rem}.card__link{color:var(--accent2);text-decoration:none;font-weight:500;transition:color .2s}.card__link:hover{color:var(--text)}.controls{position:fixed;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.6rem 2rem;padding:.7rem 1.4rem;background:var(--ctrl-bg);backdrop-filter:blur(12px);border-top:1px solid var(--ctrl-bdr);transition:background .4s,border-color .4s;z-index:50}.ctrl-group{display:flex;align-items:center;gap:.5rem}.ctrl-hint{opacity:.6}.ctrl-label{font-size:.68rem;letter-spacing:.08em;color:var(--text-dim);text-transform:uppercase;white-space:nowrap}.ctrl-row{display:flex;gap:.3rem}.ctrl-btn{padding:.28rem .65rem;border:1px solid var(--ctrl-bdr);border-radius:6px;background:rgba(0,0,0,0);color:var(--text-dim);font-size:.72rem;cursor:pointer;transition:all .18s}.ctrl-btn:hover{color:var(--text);border-color:var(--accent)}.ctrl-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}.kbd-hint{position:fixed;bottom:4rem;left:50%;transform:translateX(-50%);font-size:.64rem;color:var(--text-dimmer);white-space:nowrap;pointer-events:none;transition:color .4s}.kbd-hint kbd{display:inline-block;padding:.1rem .35rem;border:1px solid var(--ctrl-bdr);border-radius:3px;background:var(--kbd-bg);font-family:inherit;font-size:inherit;transition:all .4s}@media(max-width: 520px){.tb__right .tb__tag{display:none}.ctrl-hint{display:none}.kbd-hint{display:none}.card{border-radius:1rem}}
