main{background:var(--background);flex-direction:column;justify-content:center;align-items:center;width:100%;height:100dvh;display:flex}form{-webkit-user-select:none;user-select:none;background:#fdfdfd;border-radius:5px;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:400px;max-width:100%;padding:15px;display:flex;box-shadow:2px 2px 2px #c2c2c2,-2px 2px 2px #c2c2c2,2px -2px 2px #c2c2c2,-2px -2px 2px #c2c2c2}form h1{color:var(--accent-color);margin-bottom:20px;font-size:30px}form input{width:100%;height:auto;color:var(--accent-color);border:.5px solid gray;border-radius:3px;outline:none;padding:10px;font-size:18px}form button{cursor:pointer;background:var(--accent-color);color:#fff;border:none;border-radius:3px;outline:none;width:100%;height:auto;padding:15px;font-size:18px;font-weight:700;transition:all .3s ease-out}form button:hover{background:var(--accent-hover)}form button:disabled{cursor:not-allowed;opacity:.5}form p.error{color:#fff;text-align:center;-webkit-user-select:text;user-select:text;background:red;border-radius:5px;width:100%;height:auto;padding:15px;font-size:12px}form p.message{color:#fff;text-align:center;-webkit-user-select:text;user-select:text;background:green;border-radius:5px;width:100%;height:auto;padding:15px;font-size:12px}form p{color:var(--accent-color);font-size:14px}form p a{z-index:1;color:var(--accent-color);position:relative}form p a:before{content:"";z-index:2;background:var(--accent-color);width:100%;height:2px;transition:all .3s cubic-bezier(.165,.84,.44,1);position:absolute;bottom:0;left:0;transform:scaleX(1)}form p a:hover:before{transform:scaleX(.5)}
