/*! Sign in · the door button — © 2026 Hasib (OVERSHOOT). All rights reserved. Licensed, not sold: see LICENSE.md. */:root{--blue: #2f66f0;--blue-lo: #1f52d8;--blue-hi: #5a8cff;--violet: #7c5cff;--coral: #ff7a6b;--grad: linear-gradient(135deg, #2f66f0, #7c5cff);--cream-hi: #f9f2e4;--cream: #f1e7d2;--cream-lo: #e7d9bd;--surface: #ffffff;--field: #f4f4f8;--ink: #232733;--ink-soft: #474b58;--muted: #857e6d;--line: rgba(46, 42, 55, .12);--line-2: rgba(46, 42, 55, .18);--btn-1: #2b3d63;--btn-2: #1a2842;--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-back: cubic-bezier(.34, 1.56, .64, 1)}*{margin:0;padding:0;box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%}body{min-height:100dvh;display:grid;place-items:center;padding:clamp(1rem,5vw,3rem);font-family:Space Grotesk,system-ui,sans-serif;color:var(--ink);background:radial-gradient(38% 46% at 8% 6%,rgba(147,197,253,.55),transparent 60%),radial-gradient(42% 48% at 93% 8%,rgba(196,181,253,.62),transparent 62%),radial-gradient(46% 52% at 88% 96%,rgba(251,207,232,.6),transparent 62%),radial-gradient(44% 50% at 10% 94%,rgba(167,243,208,.46),transparent 60%),#f3f2fb;overflow:hidden;-webkit-font-smoothing:antialiased}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.stage{position:relative;display:grid;place-items:center}.card{position:relative;width:min(92vw,400px);background:var(--surface);border:1px solid var(--line);border-radius:24px;box-shadow:0 34px 64px -28px #3c286e61,0 10px 24px -14px #3c286e29;display:grid;overflow:hidden}.login,.account{grid-area:1 / 1}.login{display:flex;flex-direction:column;transition:opacity .4s var(--ease-out),transform .5s var(--ease-out)}.login.leaving{opacity:0;transform:translateY(12px) scale(.98);pointer-events:none}.login.gone{display:none}.login__head{display:flex;flex-direction:column}.login__badge{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;color:var(--blue);margin-bottom:.85rem;background:#2f66f01a;border:1px solid rgba(47,102,240,.18)}.login__badge svg{width:24px;height:24px}.login__title{font-size:1.55rem;font-weight:700;letter-spacing:-.01em;color:var(--ink)}.login__sub{margin-top:.3rem;font-size:.86rem;font-weight:500;color:var(--muted)}.login__body{display:flex;flex-direction:column;gap:.85rem;padding:1.7rem 1.75rem 1.6rem}.field{display:flex;flex-direction:column;gap:.42rem}.field__row{display:flex;align-items:baseline;justify-content:space-between}.field label{font-size:.8rem;font-weight:600;color:var(--ink-soft)}.field__link{font-family:inherit;font-size:.76rem;font-weight:600;color:var(--blue);background:none;border:none;padding:0;cursor:pointer}.field__link:hover{text-decoration:underline}.field__link:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:4px}.field__wrap{position:relative;display:flex;align-items:center}.field__icon{position:absolute;left:.9rem;width:18px;height:18px;color:var(--muted);pointer-events:none;transition:color .2s var(--ease-out)}.field input{width:100%;font-family:inherit;font-size:.96rem;color:var(--ink);background:var(--field);border:1.5px solid var(--line-2);border-radius:12px;padding:.82rem .9rem .82rem 2.65rem;outline:none;transition:border-color .2s var(--ease-out),box-shadow .2s var(--ease-out),background .2s var(--ease-out)}.field input::placeholder{color:#b4ac97}.field input:hover{border-color:#2e2a374d}.field__wrap:focus-within .field__icon{color:var(--blue)}.field input:focus-visible{border-color:var(--blue);background:#fff;box-shadow:0 0 0 4px #2f66f029}.login.invalid .field input:invalid{border-color:#e5484d;box-shadow:0 0 0 4px #e5484d24}.err{min-height:1.1em;font-size:.8rem;font-weight:600;color:#d13a3f;text-align:center}.field__toggle{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);width:32px;height:32px;display:grid;place-items:center;border:none;background:none;cursor:pointer;color:var(--muted);border-radius:9px;transition:color .2s var(--ease-out),background .2s var(--ease-out)}.field__toggle:hover{color:var(--ink);background:#282a370f}.field__toggle:focus-visible{outline:2px solid var(--blue);outline-offset:1px}.field__toggle svg{width:19px;height:19px}.field__toggle .i-eye-off,.field__toggle[aria-pressed=true] .i-eye{display:none}.field__toggle[aria-pressed=true] .i-eye-off{display:block}.field__wrap--pw input{padding-right:3rem}.remember{display:flex;align-items:center;gap:.6rem;cursor:pointer;font-size:.84rem;font-weight:500;color:var(--ink-soft);user-select:none}.remember input{position:absolute;width:1px;height:1px;opacity:0}.remember__box{width:19px;height:19px;border-radius:6px;flex:none;border:1.5px solid var(--line-2);background:#fff;color:#fff;display:grid;place-items:center;transition:background .18s var(--ease-out),border-color .18s var(--ease-out)}.remember__box svg{width:13px;height:13px;opacity:0;transform:scale(.5);transition:opacity .18s,transform .2s var(--ease-back)}.remember input:checked+.remember__box{background:var(--grad);border-color:transparent}.remember input:checked+.remember__box svg{opacity:1;transform:scale(1)}.remember input:focus-visible+.remember__box{outline:2px solid var(--blue);outline-offset:2px}.social{display:flex;flex-direction:column;gap:.8rem;margin-top:.1rem}.social__sep{position:relative;text-align:center;font-size:.74rem;font-weight:500;color:var(--muted)}.social__sep:before,.social__sep:after{content:"";position:absolute;top:50%;width:28%;height:1px;background:var(--line-2)}.social__sep:before{left:0}.social__sep:after{right:0}.social__row{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}.social__btn{height:46px;border-radius:12px;cursor:pointer;border:1.5px solid var(--line-2);background:#fff;display:grid;place-items:center;transition:transform .15s var(--ease-back),border-color .2s var(--ease-out),box-shadow .2s var(--ease-out)}.social__btn:hover{transform:translateY(-2px);border-color:#2e2a374d;box-shadow:0 10px 18px -10px #3c321e4d}.social__btn:active{transform:scale(.96)}.social__btn:focus-visible{outline:3px solid var(--blue);outline-offset:2px}.login.invalid{animation:shake .38s var(--ease-out)}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-7px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(3px)}}.doorbtn{position:relative;display:flex;align-items:center;justify-content:center;gap:26px;width:100%;min-height:56px;padding:0 20px;font-family:inherit;font-size:1.05rem;font-weight:700;color:#fff;cursor:pointer;border-radius:14px;-webkit-tap-highlight-color:transparent;transition:transform .18s var(--ease-back),box-shadow .2s var(--ease-out),filter .2s}.doorbtn__label{letter-spacing:.01em;white-space:nowrap}.doorbtn:active{transform:scale(.985)}.doorbtn:focus-visible{outline:3px solid var(--blue-hi);outline-offset:3px}.doorbtn[disabled]{cursor:default}.doorbtn--primary{margin-top:.2rem;background:linear-gradient(120deg,#26286b,#2b2f78 46%,#3a2a72);border:1px solid rgba(124,130,240,.5);box-shadow:0 16px 30px -14px #463aaa94,inset 0 1px #ffffff24}.doorbtn--primary:hover{transform:translateY(-1px);box-shadow:0 22px 38px -14px #463aaab8,inset 0 1px #ffffff2e}.doorbtn--ghost{background:linear-gradient(180deg,#313a4f,#232b3c);border:1px solid var(--line-2);color:#fff;box-shadow:0 10px 22px -14px #23283c80}.doorbtn--ghost:hover{transform:translateY(-1px);box-shadow:0 16px 28px -14px #23283c9e}.dooric{position:relative;width:62px;height:38px;flex:none;perspective:300px}.dooric__frame{position:absolute;right:0;top:2px;width:28px;height:34px;border-radius:5px;overflow:hidden;background:linear-gradient(180deg,#0b1a38,#060d20);box-shadow:inset 0 0 0 1.5px #78a0ff47}.dooric__glow{position:absolute;inset:0;background:radial-gradient(62% 72% at 50% 46%,#ffd696f2,#ffbe6e00 72%);opacity:0;transition:opacity .35s var(--ease-out)}.dooric__panel{position:absolute;right:0;top:2px;width:28px;height:34px;border-radius:5px;background:linear-gradient(180deg,var(--blue-hi),var(--blue) 55%,var(--blue-lo));box-shadow:inset 0 0 0 1.5px #fff3,inset -6px 0 10px #00000047;transform-origin:right center;transform:rotateY(0);transition:transform .42s var(--ease-out);backface-visibility:hidden}.dooric__handle{position:absolute;left:4px;top:50%;width:2.5px;height:10px;border-radius:2px;transform:translateY(-50%);background:linear-gradient(180deg,#fff,#cfe0ff)}.dooric__person{position:absolute;left:2px;bottom:2px;color:#fff;transition:transform .74s var(--ease-out),opacity .3s var(--ease-out) .36s}.dooric__person svg{display:block;overflow:visible}.leg,.arm,.shin{transform-box:fill-box;transform-origin:50% 0}.person__bob,.person{transform-box:fill-box;transform-origin:50% 100%}.leg--front{transform:rotate(11deg)}.leg--back{transform:rotate(-11deg)}.arm--front{transform:rotate(-9deg)}.arm--back{transform:rotate(9deg)}.leg--front .shin,.leg--back .shin{transform:rotate(7deg)}.person{transition:transform .25s var(--ease-out)}.doorbtn.walking .person{transform:rotate(4deg)}.doorbtn.walking .leg--front{animation:thighF .46s linear infinite}.doorbtn.walking .leg--back{animation:thighB .46s linear infinite}.doorbtn.walking .leg--front .shin{animation:shinF .46s linear infinite}.doorbtn.walking .leg--back .shin{animation:shinB .46s linear infinite}.doorbtn.walking .arm--front{animation:armF .46s linear infinite}.doorbtn.walking .arm--back{animation:armB .46s linear infinite}.doorbtn.walking .person__bob{animation:bob .23s linear infinite}@keyframes thighF{0%,to{transform:rotate(26deg)}50%{transform:rotate(-24deg)}}@keyframes thighB{0%,to{transform:rotate(-24deg)}50%{transform:rotate(26deg)}}@keyframes armF{0%,to{transform:rotate(-24deg)}50%{transform:rotate(24deg)}}@keyframes armB{0%,to{transform:rotate(24deg)}50%{transform:rotate(-24deg)}}@keyframes shinF{0%{transform:rotate(8deg)}25%{transform:rotate(48deg)}55%{transform:rotate(10deg)}to{transform:rotate(8deg)}}@keyframes shinB{0%{transform:rotate(34deg)}30%{transform:rotate(6deg)}78%{transform:rotate(44deg)}to{transform:rotate(34deg)}}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-1.4px)}}.doorbtn.dooropen .dooric__panel{transform:rotateY(72deg)}.doorbtn.dooropen .dooric__glow{opacity:.95}.doorbtn.out .dooric__person{transform:translate(36px) scale(.72);opacity:0}.doorbtn.walking .doorbtn__label{opacity:.6;transition:opacity .3s}.doorbtn.facing-out .dooric__person svg{transform:scaleX(-1)}.doorbtn.facing-out .dooric__person{transition:transform .74s var(--ease-out),opacity .5s var(--ease-out) .04s}.doorbtn.snap .dooric__person{transition:none!important}.account{align-content:center;gap:1rem;display:grid;padding:1.7rem 1.6rem;animation:rise .5s var(--ease-back)}@keyframes rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.account__row{display:flex;align-items:center;gap:.8rem}.account__avatar{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--grad);box-shadow:0 8px 18px -8px #6054eb80}.account__meta{display:flex;flex-direction:column;line-height:1.25;min-width:0}.account__meta b{font-size:1rem;color:var(--ink)}.account__meta small{font-size:.8rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sound-toggle{position:fixed;top:1rem;right:1rem;z-index:60;width:42px;height:42px;display:grid;place-items:center;font-size:1.05rem;background:#2327330f;border:1px solid var(--line);border-radius:50%;cursor:pointer;color:var(--ink);box-shadow:0 8px 18px -10px #4a3a1e66;transition:transform .2s var(--ease-back),background .2s var(--ease-out)}.sound-toggle:hover{transform:scale(1.08);background:#2327331f}.sound-toggle:focus-visible{outline:3px solid var(--blue);outline-offset:2px}.sound-toggle[aria-pressed=false]{opacity:.55}.fx{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:40}@media(prefers-reduced-motion:reduce){.dooric__person,.dooric__glow,.login,.doorbtn{transition-duration:.001ms!important}.doorbtn.walking .leg,.doorbtn.walking .arm,.doorbtn.walking .person__bob,.login.invalid,.account{animation:none!important}}