:root{
 --green:#8fd694; --mint:#b8f2c2; --blue:#9bd7f5; --yellow:#ffe6a7; --orange:#ffc38b; --pink:#f8b7d4; --text:#234;
}
*{box-sizing:border-box} body{margin:0;min-height:100vh;font-family:Inter,Arial,sans-serif;color:var(--text);background:linear-gradient(135deg,#eaffea,#dff5ff 45%,#fff1d8);display:flex;align-items:center;justify-content:center;overflow:hidden}
body:before,body:after{content:"";position:fixed;border-radius:50%;filter:blur(20px);opacity:.55;z-index:-1}
body:before{width:420px;height:420px;background:radial-gradient(circle,var(--green),transparent 70%);top:-100px;left:-80px}
body:after{width:500px;height:500px;background:radial-gradient(circle,var(--pink),transparent 70%);right:-120px;bottom:-120px}
.card{width:min(92%,520px);padding:42px;border-radius:28px;background:rgba(255,255,255,.72);backdrop-filter:blur(12px);box-shadow:0 20px 50px rgba(40,80,100,.12);text-align:center}
.logo{font-size:3rem;font-weight:800;letter-spacing:-2px;background:linear-gradient(90deg,#4caf50,#45c9a1,#3aa7e8);-webkit-background-clip:text;color:transparent;margin-bottom:10px}
.logo span{font-weight:400}
.tagline{color:#587;letter-spacing:2px;font-size:.9rem;margin-bottom:30px}
.flow{height:100px;margin:15px auto 30px;position:relative}
.flow:before{content:"";position:absolute;left:20%;right:20%;top:48px;height:18px;border-radius:20px;background:linear-gradient(90deg,#7ed957,#63c8ff,#ffc857);transform:skewX(-15deg)}
.leaf{position:absolute;width:70px;height:35px;background:linear-gradient(135deg,#8fd694,#45b97c);border-radius:70px 0;top:15px;left:38%;transform:rotate(-20deg)}
.cherry{position:absolute;width:34px;height:34px;background:#ff7898;border-radius:50%;top:15px;left:28%;box-shadow:25px 5px 0 #ff9db5}
input,button{width:100%;padding:14px;margin:8px 0;border-radius:14px;border:1px solid #ccd;background:white;font-size:1rem}
button{background:linear-gradient(90deg,#78d88a,#67bff1);color:white;border:0;font-weight:bold;cursor:pointer}
a{color:#2687a8;text-decoration:none}
.small{font-size:.9rem;color:#667}

.page-shell{width:min(94%,720px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 0;max-height:100vh;overflow:auto}
.site-logo{display:block;width:min(86vw,460px);height:auto;margin:0 auto 22px;filter:drop-shadow(0 10px 24px rgba(30,90,55,.10))}
@media (max-width:600px){.page-shell{padding:18px 0}.site-logo{width:min(88vw,360px);margin-bottom:14px}.card{padding:30px 24px}}