/* ربات صفحهٔ ورود/ثبت‌نام + دکمهٔ نمایش رمز */
.robot{display:grid;place-items:center;margin:-6px auto 6px;position:relative;z-index:1;pointer-events:none}
.robot svg{overflow:visible;filter:drop-shadow(0 12px 22px color-mix(in oklab,var(--a1) 45%,transparent))}
.robot .rb-ant{transform-origin:80px 30px;animation:rbWig 2.6s ease-in-out infinite}
.robot .rb-lid{transform-box:fill-box;transform-origin:50% 0;transform:scaleY(0);transition:transform .22s cubic-bezier(.4,0,.2,1)}
.robot .rb-pupil{transition:transform .25s ease}
.robot .rb-hand{transform-box:fill-box;transform-origin:50% 50%;transition:transform .35s cubic-bezier(.34,1.4,.5,1)}
.robot .rb-eye{transform-box:fill-box;transform-origin:50% 50%;animation:rbBlink 5s infinite}
.robot .rb-mouth{transition:d .25s}

/* رمز مخفی: چشم‌ها بسته، دست‌ها بالا */
.robot[data-state=shy] .rb-lid{transform:scaleY(1)}
.robot[data-state=shy] .rb-eye{animation:none}
.robot[data-state=shy] .rb-hand-l{transform:translate(8px,-64px)}
.robot[data-state=shy] .rb-hand-r{transform:translate(-8px,-64px)}
.robot[data-state=shy] .rb-mouth{d:path("M70 98 Q80 94 90 98")}

/* رمز نمایش داده شده: چشم‌ها باز و به رمز نگاه می‌کنند */
.robot[data-state=peek] .rb-pupil{transform:translateY(5px) scale(1.15)}
.robot[data-state=peek] .rb-mouth{d:path("M64 94 Q80 110 96 94")}

@keyframes rbWig{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
@keyframes rbBlink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
@media (prefers-reduced-motion:reduce){.robot .rb-ant,.robot .rb-eye{animation:none}.robot *{transition:none !important}}

.pw-wrap{position:relative}
.pw-wrap>input{width:100%;padding-right:50px !important}
.pw-toggle{position:absolute;top:50%;right:8px;transform:translateY(-50%);width:36px;height:36px;border-radius:11px;border:0;cursor:pointer;
  display:grid;place-items:center;background:transparent;color:var(--muted);transition:background .2s,color .2s}
.pw-toggle:hover{background:color-mix(in oklab,var(--a1) 14%,transparent);color:var(--text)}
.pw-toggle:focus-visible{outline:2px solid var(--a2);outline-offset:1px}
.pw-toggle[aria-pressed=true]{color:var(--a2)}
.pw-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.pw-toggle .off{display:none}
.pw-toggle[aria-pressed=true] .on{display:none}
.pw-toggle[aria-pressed=true] .off{display:block}