.password-tile{position:fixed;top:72px;left:50%;z-index:1000;transform:translateX(-50%) rotateY(-14deg);width:108px;height:108px;pointer-events:none;border-radius:19px;border:1px solid #adc6cd;background:linear-gradient(135deg,#ffffff,#d5e6eb);color:#537d89;box-shadow:inset 1px 2px 1px #fff,6px 8px 0 -2px #acc4cdaa,12px 18px 25px -8px #425f7455;display:grid;place-items:center}.password-tile[hidden]{display:none}.password-tile:before,.password-tile:after{content:'';position:absolute;inset:0;border:1px solid #91bbc377;border-radius:19px;transform:translate(5px,5px);z-index:-1}.password-tile:after{transform:translate(10px,10px);opacity:.5}.password-tile svg{width:53px;height:53px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.password-tile .tile-ok,.password-tile .tile-error{display:none}.password-tile .tile-line{position:absolute;height:1px;left:18px;right:18px;top:20px;background:#72a8b2;box-shadow:0 0 8px #72a8b2;animation:tileScan 1.2s ease-in-out infinite}.password-tile[data-state=success]{color:#2c9874}.password-tile[data-state=error]{color:#bc565c}.password-tile[data-state=success] .tile-ok,.password-tile[data-state=error] .tile-error{display:block}.password-tile[data-state=success] .tile-face,.password-tile[data-state=error] .tile-face,.password-tile:not([data-state=checking]) .tile-line{display:none}[data-theme=dark] .password-tile{background:linear-gradient(135deg,#57788cf5,#253a55fa);color:#b3d4d9;box-shadow:inset 1px 2px 1px #a6cfdd55,6px 8px 0 -2px #213a50,12px 18px 25px -8px #0008}[data-theme=dark] .password-tile[data-state=success]{color:#9be0bc}[data-theme=dark] .password-tile[data-state=error]{color:#f4b0b1}@keyframes tileScan{50%{transform:translateY(50px)}}@media(prefers-reduced-motion:reduce){.password-tile .tile-line{animation:none;top:46px}}
.password-tile[data-state=success] .tile-ok{stroke-dasharray:70;animation:tileDraw .45s ease-out}.password-tile[data-state=error] .tile-error{stroke-dasharray:65;animation:tileDraw .35s ease-out}.password-tile[data-state=error]{animation:tileShake .3s ease-in-out}@keyframes tileDraw{from{stroke-dashoffset:75}to{stroke-dashoffset:0}}@keyframes tileShake{25%{margin-left:-5px}75%{margin-left:5px}}@media(prefers-reduced-motion:reduce){.password-tile,.password-tile path{animation:none!important}}