:root{--green-dark:#606e52;--green-mid:#91a56e;--green-light:#c0cca4;--bg:linear-gradient(180deg,#f4f7ef,#e8efdc);--card-bg:#fff;--text-dark:#474747;--text-muted:#8f8b84;--border:#606e522e;--shadow:0 22px 60px #606e5238;--radius:14px;--ease:.22s cubic-bezier(.2,.9,.3,1);font-family:Helvetica,Arial,sans-serif}.signup-container{background:var(--bg);justify-content:center;align-items:center;min-height:100vh;padding:32px 16px;display:flex}.signup-card{background:var(--card-bg);border-radius:var(--radius);width:100%;max-width:460px;box-shadow:var(--shadow);border:1px solid var(--border);box-sizing:border-box;flex-direction:column;align-items:center;gap:10px;padding:28px 26px 24px;display:flex}.brand-heading{color:var(--green-dark);text-align:center;margin:0;font-size:1.9rem;font-weight:800}.signup-card h2{color:var(--text-dark);text-align:center;font-size:1.3rem;font-weight:700}.subtitle{color:var(--text-muted);text-align:center;margin-bottom:14px;font-size:.95rem;font-weight:600}.signup-card form{flex-direction:column;gap:14px;width:100%;display:flex}.input-group{flex-direction:column;gap:6px;display:flex}.input-group label{color:var(--green-dark);font-size:.9rem;font-weight:700}.input-group input{border:1px solid var(--border);color:var(--text-dark);transition:border-color var(--ease),box-shadow var(--ease),transform var(--ease);background:#fff;border-radius:10px;outline:none;padding:11px 12px;font-weight:600}.input-group input:focus{border-color:var(--green-mid);transform:translateY(-2px);box-shadow:0 10px 30px #91a56e59}.password-wrapper{align-items:center;display:flex;position:relative}.password-wrapper input{flex:1;padding-right:42px}.password-wrapper button{cursor:pointer;color:var(--text-muted);transition:background var(--ease),color var(--ease);background:0 0;border:none;border-radius:8px;padding:6px;position:absolute;right:8px}.password-wrapper button:hover{color:var(--green-dark);background:#606e521a}.otp-actions{gap:10px;display:flex}.otp-btn{border:1px solid var(--green-mid);height:40px;color:var(--green-dark);cursor:pointer;transition:all var(--ease);background:0 0;border-radius:10px;flex:1;font-weight:800}.otp-btn:hover{background:#91a56e26;transform:translateY(-2px)}.otp-btn.primary{color:#000;background:#fff;border:none;box-shadow:0 12px 32px #606e5259}.otp-btn.primary:hover{box-shadow:0 18px 46px #606e5273}.terms{color:var(--text-muted);align-items:center;gap:10px;font-size:.9rem;font-weight:600;display:flex}.terms input{width:18px;height:18px;accent-color:var(--green-dark)}.terms a{color:var(--green-dark);font-weight:800;text-decoration:none}.terms a:hover{text-decoration:underline}.signup-btn{background:linear-gradient(135deg,var(--green-dark),var(--green-mid));color:#fff;letter-spacing:.4px;cursor:pointer;width:100%;height:50px;transition:transform var(--ease),box-shadow var(--ease),filter var(--ease);border:none;border-radius:14px;margin-top:14px;margin-bottom:14px;font-size:1.05rem;font-weight:900}.signup-btn:disabled{cursor:not-allowed;box-shadow:none;background:linear-gradient(135deg,#606e5273,#91a56e73);transform:none}.signup-btn:hover:not(:disabled){filter:brightness(1.05);transform:translateY(-3px);box-shadow:0 18px 50px #606e5273,inset 0 1px #ffffff59}.signup-btn:active:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 28px #606e5266,inset 0 3px 6px #00000026}.login-link{color:var(--text-muted);text-align:center;font-size:.9rem;font-weight:600}.login-link a{color:var(--green-dark);font-weight:800;text-decoration:none}.login-link a:hover{text-decoration:underline}.otp-btn:disabled{opacity:.6;cursor:not-allowed}@media (max-width:520px){.signup-card{padding:20px 18px}.brand-heading{font-size:1.6rem}.signup-card h2{font-size:1.15rem}}.signup-card :focus-visible{outline-offset:4px;outline:3px solid #91a56e73}@media (prefers-reduced-motion:reduce){*{transition:none!important}}.reveal{opacity:0;max-height:0;transition:max-height .36s var(--ease),opacity .26s var(--ease);pointer-events:none;margin-top:0;overflow:hidden}.reveal.show{opacity:1;pointer-events:auto;max-height:800px;margin-top:12px}.reveal .input-group{margin-top:8px}
