*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#3b2b3a;background:linear-gradient(160deg,#fff4f7 0%,#fde7ef 45%,#eef7ea 100%);min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 16px;overflow-x:hidden}
.bg{position:fixed;inset:0;pointer-events:none;z-index:0}
.f{position:absolute;opacity:.35;animation:sway 9s ease-in-out infinite}
.f1{width:140px;left:-30px;top:8%;color:#f49ac1}
.f2{width:90px;right:6%;top:6%;color:#c39bd3;animation-delay:-2s}
.f3{width:180px;right:-50px;bottom:4%;color:#f7a072;animation-delay:-4s}
.f4{width:70px;left:12%;bottom:12%;color:#e57fa7;animation-delay:-1s}
.f5{width:110px;left:46%;top:-30px;color:#a8d5a2;animation-delay:-6s}
.f6{width:60px;right:30%;bottom:-10px;color:#f49ac1;animation-delay:-3s}
@keyframes sway{0%,100%{transform:rotate(0deg) translateY(0)}50%{transform:rotate(12deg) translateY(-8px)}}
.card{position:relative;z-index:1;width:100%;max-width:380px;background:rgba(255,255,255,.88);backdrop-filter:blur(6px);border-radius:20px;box-shadow:0 12px 40px rgba(180,90,130,.18);padding:32px 28px 24px;text-align:center}
.logo{width:64px;height:64px;color:#ec6f9f;margin-bottom:8px}
h1{font-size:1.5rem;margin:0 0 4px;font-weight:650}
.sub{margin:0 0 22px;color:#8a6f86}
form{display:flex;flex-direction:column;gap:14px;text-align:left}
label span{display:block;font-size:.85rem;margin-bottom:5px;color:#6d5469}
input{width:100%;padding:11px 13px;border:1px solid #e9cdda;border-radius:10px;font:inherit;background:#fff;color:inherit;outline:none;transition:border-color .15s,box-shadow .15s}
input:focus{border-color:#ec6f9f;box-shadow:0 0 0 3px rgba(236,111,159,.18)}
button{margin-top:4px;padding:12px;border:0;border-radius:10px;background:#ec6f9f;color:#fff;font:inherit;font-weight:600;cursor:pointer;transition:background .15s}
button:hover{background:#dd5b8d}
button:disabled{opacity:.65;cursor:default}
.err{margin:0;padding:9px 12px;border-radius:8px;background:#fdecef;color:#b3264f;font-size:.9rem}
.foot{margin:18px 0 0;font-size:.85rem}
.foot a{color:#a0577c;text-decoration:none}
.foot a:hover{text-decoration:underline}
footer{position:relative;z-index:1;margin-top:20px;font-size:.8rem;color:#a08a9c}
@media (prefers-color-scheme:dark){
body{color:#f3e6ee;background:linear-gradient(160deg,#2a1d27 0%,#24192a 50%,#1b2620 100%)}
.card{background:rgba(40,28,38,.88);box-shadow:0 12px 40px rgba(0,0,0,.4)}
.sub,label span{color:#c7aabd}
input{background:#2f2230;border-color:#5a3f52}
.err{background:#4a2030;color:#ffb3c6}
.foot a{color:#f0a3c6}
footer{color:#8f7a8a}
}